1、了解javascript的一些常识
(1)什么是javascript
最早由网景公司开发的一种脚本语言, 被浏览器解释执行。
是一个文本文件,后缀为.js
用来向 html页面添加动态的交互行为。
(2)javascript的作用
为页面添加动态行为
数据验证
动态改变页面外观
2、一个简单的javascript程序。
体会基于事件的响应方式
3、掌握javascript脚本引入方式:
(1)页面内部
<script type="text/JavaScript">
alert('hello');
</script>
(2)单独放在文件里
<script type="text/JavaScript" src="js01.js"></script>
(3)嵌入html元素内部
<a href="javascript:alert('hello’);">sayHello</a>
4、掌握常见的数据类型及操作
(1)基本类型
JS有5种基本数据类型
number, string, boolean,null,undefined
var i = 100; var str = "abc"; var flag = true;
var j = null;
几个需要注意的问题:
var a = null; alert(a == undefined);
typeof 用于返回类型
Infinity和NaN
对于number类型Infinity表示无穷, NaN表示非数字
isNaN("aaa")
将字符串转换为数值
parseInt(…)。如何转换为double? 小技巧。
将数值转换为字符串
toString(…)
(2)字符串的基本属性和方法
length属性 返回字符串的长度
charAt(index) 返回指定位置的字符
substring(from, to) 返回子字符串
indexOf(str) 指定字符串在原字符串中第一次出现的位置
lastIndexOf(str) 指定字符串在原字符串中最后一次出现的的位置
match(regexp) 返回匹配指定正则表达式的字符串,返回的结果是一个数组
var str2 = 'asd212abc345';
var reg2 = /[0-9]+/g;
var arr = str2.match(reg2);
search(regexp) 返回按照正则表达式检索到的字符串位置
str2.search(reg2)
toLowerCase/toUpperCase 返回小写/大写形式
replace(regexp,'abc'); 替换符合reg正则表达式规定的字符串
str2 = str2.replace(reg2,'888');
5、掌握数组的使用
创建数组, 长度由后期赋值决定
var a = [1,2,3,4,5];
var b = [];
var c = new Array();
length属性返回数组的长度
toString()方法, 返回数组的字符串表示
concat方法, 用于连接两个数组
join方法,用于将数组中的各个元素连接成字符串。
reverse方法,将数组反转
slice用于截取数组的一部分并以数组的形式返回
sort()排序,可通过如下形式来重新定义排序方式:
var arr4 = arr3.sort(function(a1,a2){
return -a1.length + a2.length;
});
(事件处理机制
事件对象 EventObject
IE 全局的事件对象
可以通过window.event来获得。
window.event可以通过事件对象来获得事件的相关信息比如时间源,坐标
对于Firefox
firefox 每次操作才产生一个事件对象 (比如 点击)
在方法中加入event,可以通过event把事件传过去
例:function test1(e){
alert(e.clientX);
}
<a href="javascript:;" onclick="test1(event);">测试事件2</a>
form和链接,都是onclick
事件冒泡机制:子对象抛出的事件对象会向上再次抛给父对象
事件对象会传给父对象
如果想取消传播,应该e.cancelBubble=true;
e.cancelBubble=true;
)
6、掌握常见事件
onclick 鼠标单击
onchange 内容改变
onfocus 获得焦点
onblur 失去焦点
onload 元素加载显示 //HTML加载的时候
onunload 页面关闭 //关闭窗口的时候
onmouseout 鼠标移出
onmouseover 鼠标移到
onDblClick 鼠标双击
7、如何访问页面内元素
getElementByID()
使用prototype