Js元素获取与操作
可以使用内置对象document上的getElementById方法来获取页面上设置了id属性的元素，获取到的是一个html对象，然后将它赋值给一个变量，比如：
<script type="text/javascript">
var oDiv = document.getElementById('div1');
</script>
....
<div id="div1">这是一个div元素</div>
上面的语句，如果把javascript写在元素的上面，就会出错，因为页面上从上往下加载执行的，javascript去页面上获取元素div1的时候，元素div1还没有加载，解决方法有两种：
第一种方法：将javascript放到页面最下边
<div id="div1">这是一个div元素</div>
....
<script type="text/javascript">
var oDiv = document.getElementById('div1');
</script>
</body>
第二种方法：将javascript语句放到window.onload触发的函数里面,获取元素的语句会在页面加载完后才执行，就不会出错了。
<script type="text/javascript">
window.onload = function(){
var oDiv = document.getElementById('div1');
}
</script>
....
<div id="div1">这是一个div元素</div>
样式操作
标签对象.style.css属性名="值" //改变标签对象的样式。
示例：id.style.color="red";
注意：属性名相当于变量名,所以css属性名中含有双拼词的(font-size)的减号要去掉，将后面的首字母大写。fontSize
文本操作
标签对象.innerHTML="内容"；//在标签对象内放置指定内容
表单中值的操作
标签对象.value； //获取标签对象的value值
标签对象.value=”值“；//设置标签对象的value值
Js定时器
通过使用 JavaScript，我们有能力作到在一个设定的时间间隔之后来执行代码，而不是在函数被调用后立即执行。我们称之为计时事件。
定时器在javascript中的作用
1、制作动画
2、异步操作
3、函数缓冲与节流
定时器类型及语法
setInterval() - 间隔指定的毫秒数不停地执行指定的代码。 setTimeout() - 暂停指定的毫秒数后执行指定的代码
setInterval() 和 setTimeout() 是 Window对象的两个方法。
/*
定时器：
setTimeout 只执行一次的定时器
clearTimeout 关闭只执行一次的定时器
setInterval 反复执行的定时器
clearInterval 关闭反复执行的定时器
*/
var time1 = setTimeout(myalert,2000);
var time2 = setInterval(myalert,2000);
/*
clearTimeout(time1);
clearInterval(time2);
*/
function myalert(){
alert('ok!');
}
Js函数
*第一种是使用function语句定义函数
function abc(){
alert('abc');
}
*第二种是在表达式中定义函数
var 函数名 = function\(参数1，参数2，…\){函数体};
//例如：
//定义
var add = function\(a,b\){
return a+b;
}
//调用函数
document.write\(add\(50,20\)\);
arguments
在函数代码中，使用特殊对象 arguments，开发者无需明确指出参数名，就能访问它们。
例如，在函数 sayHi() 中，第一个参数是 message。用 arguments[0]
也可以访问这个值，即第一个参数的值（第一个参数位于位置 0，
第二个参数位于位置 1，依此类推）。
关于变量和参数问题：
函数外面定义的变量是全局变量，函数内可以直接使用。
在函数内部没有使用var定义的=变量则为全局变量，
*在函数内使用var关键字定义的变量是局部变量，即出了函数外边无法获取。
js函数定义的参数没有默认值,(形参的默认值在之前只有新版火狐支持,目前新版的chrome浏览器也可以支持)
Js对象
1.使用原始的方式创建内置对象
var myObject = new Object();
myObject.name = “lijie”;
myObject.age = 20;
myObject.say = function(){...}
2.直接创建自定义对象
var 对象名 = {属性名1：属性值，属性名2：属性值2，…….}
3.使用自定义构造函数创建对象
function pen(name,color,price){
//对象的name属性
this.name = name;
//对象的color属性
this.color = color;
//对象的piece属性
this.price = price;
//对象的say方法
this.say = function(){};
}
var pen = new pen(“铅笔”,”红色”,20);
pen.say();
this关键字
this单词本身就是 这个 的意思
在对象的方法中使用,代表着当前这个对象
意味着当对象调用这个方法时,方法中的this就代表着这个对象
遍历
for(var i in window){
document.write(i+”----”+window[i]);
}
这种语句可以遍历对象中的所有属性或数组中的所有元素。
关于类型
测试类型:
1.typeof() //global对象的其中一个方法，typeof()
2.对象.constructor; //查看当前对象的构造函数是谁
if(arr.constructor==Array){
alert("数组"); //数组推荐用这种方法，因为typeof得到是object
}
Js数组
数组就是一组数据的集合，javascript中，数组里面的数据可以是不同类型的。
定义数组的方法
//对象的实例创建
var aList = new Array(1,2,3);
//直接量创建
var aList2 = [1,2,3,'asd'];
操作数组中数据的方法
1、获取数组的长度：aList.length;
var aList = [1,2,3,4];
alert(aList.length); // 弹出4
2、用下标操作数组的某个数据：aList[0];
var aList = [1,2,3,4];
alert(aList[0]); // 弹出1
3、push() 和 pop() 从数组最后增加成员或删除成员
var aList = [1,2,3,4];
aList.push(5);
alert(aList); //弹出1,2,3,4,5
aList.pop();
alert(aList); // 弹出1,2,3,4
4、unshift()和 shift() 从数组前面增加成员或删除成员
var aList = [1,2,3,4];
aList.unshift(5);
alert(aList); //弹出5,1,2,3,4
aList.shift();
alert(aList); // 弹出1,2,3,4
5、splice() 在数组中增加或删除成员
var aList = [1,2,3,4];
aList.splice(2,1,7,8,9); //从第2个元素开始，删除1个元素，然后在此位置增加'7,8,9'三个元素
alert(aList); //弹出 1,2,7,8,9,4
多维数组
多维数组指的是数组的成员也是数组的数组。
var aList = [[1,2,3],['a','b','c']];
alert(aList[0][1]); //弹出2;
Js数学对象Math
//四舍五入
var res = Math.round(5.921);
//获取最大值
var res = Math.max(10,23,523,43,65,46,32,32);
//获取最小值
var res = Math.min(12312,324,32,42,3,23,412,4332,21,3,-1);
//获取绝对值
var res = Math.abs(-100);
//退一取整
var res = Math.floor(1.9);
//进一取整
var res = Math.ceil(1.1);
//幂运算 用来获取x的y次方 2的3次方
var res = Math.pow(2,3);
//开方运算 返回一个数的平方根
var res = Math.sqrt(9);
random() 返回 0 ~ 1 之间的随机数。
random 返回 0 ~ 1 之间的随机数。
random 获取一个随机数 返回0-1之间的随机小数 有可能到0 ,但是不会取到1
//random 获取一个随机数 返回0-1之间的随机小数 有可能到0 ,但是不会取到1
var res = Math.random();
//0-9随机数 小数
var res = Math.random()*10;
//0-9随机整数 (9-0 +1) +0
var res = Math.floor(Math.random()*10);
//1-10随机整数(10-1 +1) +1
var res = Math.floor(Math.random()*10)+1;
//0-10随机整数(10-0 +1) +0
var res = Math.floor(Math.random()*11)+0;
//5-15随机整数(15-5 +1) +5
var res = Math.floor(Math.random()*11)+5;
//3-99 (99-3 +1) +3
//封装函数
function rand(m,n){
return Math.floor(Math.random()*(n-m+1))+m;
}
var res = rand(20,30);
console.log(res);
Js正则
正则表达式使用单个字符串来描述、匹配一系列符合某个句法规则的字符串,
正则表达式通常被用来检索、替换那些符合某个模式的文本
声明方式
new RegExp();
/hehe/
转义字符
\w \W \d \D \s \S
var reg = /\w/;//单个的字母数字下划线
var reg = /\W/;//单个的非字母数字下划线
var reg = /\d/;//单个数字字符
var reg = /\D/;//单个非数字字符
var reg = /\s/;//单个空白字符
var reg = /\S/;//单个的非空白字符
元字符
. * + ? {} [] () | ^ $
var reg = /./;//除了换行外的其它任意字符
var reg = /z*/;//匹配0次或多次
var reg = /z+/;//匹配至少1次或多次
var reg = /\w+?/;//禁止贪婪
var reg = /\w{5}/;//限制匹配的次数
var reg = /\w{5,12}/;//限制匹配5到12次
var reg = /[a-z_A-Z0-9]+/;//字符范围
var reg = /\d+(\w+)\w+/;//子组
var reg = /abc|def|123/;//或
var reg = /^\$/;//限制开始
var reg = /a$/;//限制结尾
常用方法
test（） exec（）
var res = reg.test(str);//返回布尔类型的值,存在true 不存在就false
var res1 = reg.exec(str);//返回值 如果匹配到返回数组,如果不存在 返回 null.
浙公网安备 33010602011771号