1.操作class时,由于class是保留字,所以需要替换未className。
oDiv.className='text';
2.getElementsByTagName
该方法是动态方法,获取的节点会动态变化,在使用相应变量时再决定获取了多少个元素。返回类数组,有着数组类似的操作方法。可以在任意父元素下使用。
var aLis = document.getElementsByTagName('li');
console.log(aLis.length);
console.log(aLis[0]);
3.cssText
提供操作元素style的便捷方式。请看下面的例子。
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>class操作</title>
<style>
#text {
border: 1px solid red;
}
</style>
</head>
<body>
<div id="text">123</div>
<input id="btn" type="button" value="按钮"/>
<script>
var text = document.getElementById('text');
var btn = document.getElementById('btn');
text.onclick = function () {
text.style.cssText = 'width: 100px; height: 100px;';
};
btn.onclick = function () {
text.style.cssText = 'width: 200px';
};
</script>
</body>
</html>
4.自定义属性
想要建立匹配或对应关系,就使用自定义属性。下面的例子为一个常见应用。
var aInputs = document.getElementsByTagName('input');
for (var i = 0; i < aInputs.length; i++) {
aInputs[i].index = i;
aInputs[i].onclick = function () {
console.log(this.index);
}
}
5.数据类型
从typeof的角度上讲,javascript的数据类型有以下几种:
Number(NaN)/String/Boolean/Undefined/Function/Object(null)
注意,ES6新增了一种
Symbol
6.Number
整体上尽量转
Number('') //0
Number(' ') //0
Number(false) //0
Number(true) //1
Number([]) //0
Number([1]) //1
Number(['123']) //123
Number({}) //NaN
Number(null) //0
Number(undefined) //NaN
7.隐式转换
Number/parseInt/parseFloat为显式转换。
/ % - * ++ --: 转为数字
+:转为字符串
< >:数字的比较 字符串的比较
!: 取反(false 0 NaN '' null undefined)
== ===:判断相等
8.NaN
typeof Number('a'); // 'number'
NaN === NaN; // false
isNaN()方法内置Number转换,凡是Number能转换的,都认为是数字,则isNaN返回false。
9.作用域见视频
10.false
false, 0, NaN, '', undefined, null
11.arguments
实参的集合,类数组
12.getComputedStyle/currentStyle
getComputedStyle支持所有的标准浏览器(>IE8),currentStyle支持IE6/IE7/IE8。
function getStyle(obj, attr) {
return obj.currentStyle ? obj.currentStyle[attr] : getComputedStyle(obj, 250)[attr];
}
注意:1.不要用来获取复合样式;2.不要用来获取没有设置过的样式。
13.字符串
var str = 'javascript';
str.length;
str.charAt(0);
str.charCodeAt(0);//(String.fromCharCode(22937))
str.indexOf('java', 0);
str.lastIndexOf('java', 0);
/*
1.若不传参或只传0,则默认全部截取;
2.会大小交换位置;
3.负数当0处理。
*/
str.substring(start, end);
/*
1.若不传参或只传0,则默认全部截取;
2.若start为负数,则从后往前处理。
*/
str.substr(start, length);
/*
1.若不传参或只传0,则默认全部截取;
2.不会大小交换位置;
3.负数从后往前处理。
*/
str.slice(start, end);
str.toUpperCase();
str.toLowerCase();
/*
1.若不传splitStr,则将原字符串转为length=1的数组;
2.若splitStr=='',则将原字符串转为length=str.length的数组。
*/
str.split(splitStr, [length]);
网友评论