JavaScript的诞生背景
在上世纪90年代,欧美各国的web程序日益流行,但是当时用户上网还都在使用电话拨号上网,通过
调制解调器,网速仅仅只有28kb/s。而web程序的展现却日渐丰富。当时在没有JavaScript的年代,表单
验证等操作都是在服务器端执行的。
举个例子,用户进入到一个注册页面,填写用户名,密码,个人信息,点击注册,好,事大了。。。
发送信息,开始网络传输,等了十几秒,服务器接到浏览器客户端发送的信息,开始处理,然后把处理
信息返回客户端浏览器,用户突然发现提示用户名填写要大写字母开头,修改,然后点击注册。。。
然后重复上一步,最后又提示密码太短,不够安全。仅仅一个简单的注册页面可能在表单验证花费大量
时间,浪费带宽。这对用户是难以忍受的。
在这种背景下,社会急需一种客户端语言,来解决这类问题。当时处在科技前沿的Netscape(网景公司)
开始着手开发一种客户端脚本语言。
1995 就职于Netscape的布兰登.爱奇在网景浏览器2.0中开发一个称之为 LiveScript 的脚本语言,为了
赶上和媒体热炒Java的热潮,改名为JavaScript。从此JavaScript诞生。
JavaScript标准化
人怕出名猪怕壮,JavaScript一经推出在社会引起广泛关注,不同版本的JavaScript语言纷纷出来,
当时比较流行的有:Netscape Navigator 3.0 中的 JavaScript、IE 中的 JScript 以及 CEnvi 中的
ScriptEase。这对于程序员来说如果要开发一个对用户友好的web程序,或许兼容性就是一大工作量,毕竟
有的用户用的浏览器各不相同,而内嵌的脚本语言也不相同。对于JavaScript标准化就凸显出来了。
在1997年,由sun,微软,等一些科学家,程序员,坐在一起开了个会,并制定了ECMA-262标准,规范化
ECMAScript从此浏览器各大厂商将ECMAScript作为JavaScript实现的基础。
JavaScript的组成
JavaScript由ECMAScript,BOM,DOM三部分组成,其中ECMAScript为JavaScript的核心,规定了JavaScript
的变量,类型,关键字,函数等基础语言。DOM为文档操作对象,是操作HTML,XML元素的接口,BOM为浏览器
对象,可以对浏览器窗口进行访问和操作。
在ECMA262标准只定义了ECMAScriptd的标准,对于DOM。BOM并没有标准,BOM,DOM是属于宿主对象。
所谓的宿主就是JavaScript的运行环境,比如现在所看到的浏览器。不同的浏览器对于宿主对象略有差别
所以做前端面临最痛苦的兼容问题主要就是BOM和DOM引起的。
JavaScript基础知识
1.区分大小写
var a ;var A 是不一样的
function myName() function myname()也是不一样的
2.每行以分号结尾,分号可有可无,但为了保持良好编码习惯,我们以后都加上‘;‘。
var a = ‘hello‘
var b = ‘javascript‘;
3.JavaScript注释
单行注释//
多行注释/*开头 */结尾。中间部分都是被注释掉的内容
//var a = ‘123‘ 我被注释掉了,不会被执行。
/* var b =‘123‘;
alert(b);
*/ 中间部分都被注释掉了不会执行
4.{}花括号表示代码块,代码块里封装一系列语句
window.onload()=function(){
…………语句
}
if(true){
…………语句
}
5 忽略多余空白
var num = 1;
var num=1;
var result = 1+ 2;
var result = 1 + 2;
第一个JavaScript例子
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title></title>
<script>
function sayHello(){
//我是注释
var a = "hello, javascript!!!";
alert(‘我先执行‘);
alert(a);
}
</script>
</head>
<body>
<input type="button" value=‘hello‘ onclick="sayHello()"/>
</body>
</html>
JavaScript代码嵌入位置
JavaScript代码要放到<script>…………<script>标签里面
<script></script>标签的嵌入位置可以在head中也可在body中
以上代码虽然没什么问题,但是稍微变一变,就会存在问题。
我们在上一个例子的基础上多加一个字体内容改变的小功能。
为了避免一些由于加载顺序而获取不到元素的问题。我们要不然在body
中嵌入js代码,要不然使用windo.onload函数来延迟js代码加载。
改进JavaScript例子sayHello
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title></title>
<script>
window.onload = function(){
document.getElementById(‘p1‘).innerHTML=‘sayHello‘;
}
//document.getElementById(‘p1‘).innerHTML=‘sayHello‘;此处由于加载顺序p1获取不到出错。
function sayHello(){
//我是注释
var a = "hello, javascript!!!";
alert(‘p1标签已经存在‘);
alert(a);
}
</script>
</head>
<body>
<p id=‘p1‘>hello,javascript</p>
<input type="button" value=‘hello‘ onclick="sayHello()"/>
<script>
//document.getElementById(‘p1‘).innerHTML=‘sayHello‘;
</script>
</body>
</html>
限于文章篇幅原因,这里仅仅介绍冰山一角。由于笔者的水平有限,编写时间也很仓促,
文中难免会出现一些错误或者不准确的地方,不妥之处恳请读者批评指正
说在最后的话:
本博会开一个JS专栏,长期更新,由浅入深带大家系统的学习JavaScript,做出多彩的JS特效。
如果对你有用就关注一下吧。
想观看JS视频的博友可以在51CTO上搜索《多彩JavaScript》。