一、js的簡介
1汁咏、js是什么
js是可以嵌入到html中，是 基于對象 和 事件驅(qū)動(dòng) 的 腳本語言
特點(diǎn)：
(1)交互性
(2)安全性：js不能訪問本地磁盤
(3)跨平臺(tái)：瀏覽器中都具備js解析器
2、js能做什么
(1)js能動(dòng)態(tài)的修改(增刪)html和css的代碼
(2)能動(dòng)態(tài)的校驗(yàn)數(shù)據(jù)
3咏瑟、js歷史及組成
ECMAScript BOM(瀏覽器對象模型) DOM(文檔對象模型)
4、js被引入的方式
(1)內(nèi)嵌腳本
<input type="button" value="button" onclick="alert('xxx')" />
(2)內(nèi)部腳本
<script type="text/javascript">
alert("xxx");
</script>
(3)外部腳本
首先先創(chuàng)建一個(gè)js文件
其次在html中引入
<script type="text/javascript" src="demo1.js"></script>
js代碼放在哪痪署？
放在哪都行,在不影響html功能的前提下 越晚加載越好
二码泞、js基本語法
1、變量
(1)
var x = 5;
x = 'javascript';
var y = "hello";
var b = true;
(2)
x = 5;
2狼犯、原始數(shù)據(jù)類型
介紹
(1)number:數(shù)字類型
(2)string：字符串類型
(3)boolean:布爾類型
(4)null:空類型
(5)underfind:未定義
注意：number余寥、boolean、string是偽對象
類型轉(zhuǎn)換：
1）number\boolean轉(zhuǎn)成string
toString();
2）string\boolean轉(zhuǎn)成number
parseInt()
parseFloat()
boolean不能轉(zhuǎn)
string可以將數(shù)字字符串轉(zhuǎn)換成number 如果“123a3sd5” 轉(zhuǎn)成123
3）強(qiáng)制轉(zhuǎn)換
Boolean() 強(qiáng)轉(zhuǎn)成布爾
數(shù)字強(qiáng)轉(zhuǎn)成布爾 非零就是true 零就是false
字符串強(qiáng)轉(zhuǎn)成布爾 非“”(空字符串)就是true 空字符串“”就是false
Number() 強(qiáng)轉(zhuǎn)成數(shù)字
布爾轉(zhuǎn)數(shù)字 true轉(zhuǎn)成1 false轉(zhuǎn)成0
字符串轉(zhuǎn)數(shù)字 不能強(qiáng)轉(zhuǎn)
3悯森、引用數(shù)據(jù)類型
java: Object obj = new Object();
js: var obj = new Object();
var num = new Number();
4宋舷、運(yùn)算符
(1)賦值運(yùn)算符
var x = 5;
(2)算數(shù)運(yùn)算符
+ - * / %
+: 遇到字符串變成連接
-：先把字符串轉(zhuǎn)成數(shù)字然后進(jìn)行運(yùn)算
*: 先把字符串轉(zhuǎn)成數(shù)字然后進(jìn)行運(yùn)算
/: 先把字符串轉(zhuǎn)成數(shù)字然后進(jìn)行運(yùn)算
(3)邏輯運(yùn)算符
&& ||
(4)比較運(yùn)算符
< > >= <= != ==
===:全等：類型與值都要相等
(5)三元運(yùn)算符
3<2?"大于":"小于"
(6)void運(yùn)算符
<a href="javascript:void(0);">xxxxxx</a>
(7)類型運(yùn)算符
typeof:判斷數(shù)據(jù)類型 返回我的數(shù)據(jù)類型
instanceof：判斷數(shù)據(jù)類型 是否是某種類型
var obj = new Object();
alert(typeof obj);//object
alert(obj instanceof Object);//true
5、邏輯語句
(1)if-else
//條件:
//數(shù)字非0 字符串非空====true
if(9){
alert("true--");
}else{
alert("false--");
}
(2)switch
var x = "java";
switch(x){
case "css":
alert("css");
break;
case "js":
alert("js");
break;
case "java":
alert("java");
break;
default:
alert("def");
}
(3)for
for(var i = 0;i<5;i++){
alert(i);
}
(4)for in
var arr = [1,3,5,7,"js"];
for(index in arr){//index代表角標(biāo)
//alert(index);
alert(arr[index]);
}
三瓢姻、js內(nèi)建對象
1肥缔、Number
創(chuàng)建方式：
var myNum=new Number(value);
var myNum=Number(value);
屬性和方法：
toString():轉(zhuǎn)成字符串
valueOf()：返回一個(gè) Number 對象的基本數(shù)字值
2、Boolean
創(chuàng)建方式：
var bool = new Boolean(value);
var bool = Boolean(value);
屬性和方法：
toString():轉(zhuǎn)成字符串
valueOf()：返回一個(gè) Boolean 對象的基本值(boolean)
3、String
創(chuàng)建方式：
var str = new String(s);
var str = String(s);
屬性和方法：
length:字符串的長度
charAt():返回索引字符
charCodeAt:返回索引字符unicode
indexOf():返回字符的索引
lastIndexOf();逆向返回字符的索引
split();將字符串按照特殊字符切割成數(shù)組
substr():從起始索引號提取字符串中指定數(shù)目的字符
substring():提取字符串中兩個(gè)指定的索引號之間的字符
toUpperCase();轉(zhuǎn)大寫
4续膳、Array
創(chuàng)建方式：
var arr = new Array();//空數(shù)組
var arr = new Array(size);//創(chuàng)建一個(gè)指定長度的數(shù)據(jù)
var arr = new Array(element0, element1, ..., elementn);//創(chuàng)建數(shù)組直接實(shí)例化元素
var arr = [];//空數(shù)組
var arr = [1,2,5,"java"];//創(chuàng)建數(shù)組直接實(shí)例化元素
屬性和方法：
length:數(shù)組長度
join()：把數(shù)組的所有元素放入一個(gè)字符串改艇。元素通過指定的分隔符進(jìn)行分隔一個(gè)
pop():刪除并返回最后元素
push()：向數(shù)組的末尾添加一個(gè)或更多元素，并返回新的長度
reverse();反轉(zhuǎn)數(shù)組
sort();排序
5坟岔、Date
創(chuàng)建方式：
var myDate = new Date();
var myDate = new Date(毫秒值);//代表從1970-1-1到現(xiàn)在的一個(gè)毫秒值
屬性和方法：
getFullYear():年
getMonth():月 0-11
getDate():日 1-31
getDay()：星期 0-6
getTime():返回1970年1月1日午夜到指定日期（字符串）的毫秒數(shù)
toLocalString();獲得本地時(shí)間格式的字符串
6谒兄、Math
創(chuàng)建方式：
Math 對象并不像 Date 和 String 那樣是對象的類，因此沒有構(gòu)造函數(shù) Math()社付，
像 Math.sin() 這樣的函數(shù)只是函數(shù)承疲，不是某個(gè)對象的方法。無需創(chuàng)建它鸥咖，通過把 Math 作為對象使用就可以調(diào)用其所有屬性和方法燕鸽。
屬性和方法
PI：圓周率
abs():絕對值
ceil():對數(shù)進(jìn)行上舍入
floor():對數(shù)進(jìn)行下舍入
pow(x,y)：返回 x 的 y 次冪
random():0-1之間的隨機(jī)數(shù)
round():四舍五入
7、RegExp
創(chuàng)建方式：
var reg = new RegExp(pattern);
var reg = /^正則規(guī)則$/;
規(guī)則的寫法：
[0-9]
[A-Z]
[a-z]
[A-z]
\d 代表數(shù)據(jù)
\D 非數(shù)字
\w 查找單詞字符
\W 查找非單詞字符
\s 查找空白字符
\S 查找非空白字符
n+ 出現(xiàn)至少一次
n* 出現(xiàn)0次或多次
n? 出現(xiàn)0次或1次
{5} 出現(xiàn)5
{2,8} 2到8次
方法：
test(str):檢索字符串中指定的值啼辣。返回 true 或 false
需求：校驗(yàn)郵箱
var email = haohao_827@163.com
var reg = /^[A-z]+[A-z0-9_-]*\@[A-z0-9]+\.[A-z]+$/;
reg.test(email);
四啊研、js的函數(shù)
1、js函數(shù)定義的方式
(1)普通方式
語法：function 函數(shù)名(參數(shù)列表){函數(shù)體}
示例：
function method(){
alert("xxx");
}
method();
(2)匿名函數(shù)
語法：function(參數(shù)列表){函數(shù)體}
示例：
var method = function(){
alert("yyy");
};
method();
(3)對象函數(shù)
語法：new Function(參數(shù)1,參數(shù)2,...,函數(shù)體);
注意：參數(shù)名稱必須使用字符串形式鸥拧、最后一個(gè)默認(rèn)是函數(shù)體且函數(shù)體需要字符串形式
示例：
var fn = new Function("a","b","alert(a+b)");
fn(2,5);
2党远、函數(shù)的參數(shù)
(1)形參沒有var去修飾
(2)形參和實(shí)參個(gè)數(shù)不一定相等
(3)arguments對象 是個(gè)數(shù)組 會(huì)將傳遞的實(shí)參進(jìn)行封裝
function fn(a,b,c){
//var sum = a+b+c;
//alert(sum);
//arguments是個(gè)數(shù)組 會(huì)將傳遞的實(shí)參進(jìn)行封裝
for(var i=0;i<arguments.length;i++){
alert(arguments[i]);
}
}
fn(1,2,4,8);
3摘能、返回值
(1)在定義函數(shù)的時(shí)候不必表明是否具有返回值
(2)返回值僅僅通過return關(guān)鍵字就可以了 return后的代碼不執(zhí)行
function fn(a,b){
return a+b;
//alert("xxxx");
}
alert(fn(2,3));
4焚辅、js的全局函數(shù)
(1)編碼和解碼
encodeURI() decodeURI()
encodeURIComponet() decodeURIComponent()
escape() unescape()
三者區(qū)別：
進(jìn)行編碼的符號范圍不同吧应闯，實(shí)際開發(fā)中常使用第一種
(2)強(qiáng)制轉(zhuǎn)換
Number()
String()
Boolean()
(3)轉(zhuǎn)成數(shù)字
parseInt()
parseFloat()
(4)eval()方法
將字符串當(dāng)作腳本進(jìn)行解析運(yùn)行,
代碼嵌入的一種
var str = "var a=2;var b=3;alert(a+b)";
eval(str);
function print(str){
eval(str);
}
print("自定義邏輯");
五铣猩、js的事件
事件
事件源
響應(yīng)行為
1、js的常用事件
onclick:點(diǎn)擊事件
onchange:域內(nèi)容被改變的事件
需求：實(shí)現(xiàn)二級聯(lián)動(dòng)
<select id="city">
<option value="bj">北京</option>
<option value="tj">天津</option>
<option value="sh">上海</option>
</select>
<select id="area">
<option>海淀</option>
<option>朝陽</option>
<option>東城</option>
</select>
<script type="text/javascript">
var select = document.getElementById("city");
select.onchange = function(){
var optionVal = select.value;
switch(optionVal){
case 'bj':
var area = document.getElementById("area");
area.innerHTML = "<option>海淀</option><option>朝陽</option><option>東城</option>";
break;
case 'tj':
var area = document.getElementById("area");
area.innerHTML = "<option>南開</option><option>西青</option><option>河西</option>";
break;
case 'sh':
var area = document.getElementById("area");
area.innerHTML = "<option>浦東</option><option>楊浦</option>";
break;
default:
alert("error");
}
};
</script>
onfoucus:獲得焦點(diǎn)的事件onblur:失去焦點(diǎn)的事件
需求： 當(dāng)輸入框獲得焦點(diǎn)的時(shí)候饶氏，提示輸入的內(nèi)容格式
當(dāng)輸入框失去焦點(diǎn)的時(shí)候嘹狞，提示輸入有誤
<label for="txt">name</label>
<input id="txt" type="text" /><span id="action"></span>
<script type="text/javascript">
var txt = document.getElementById("txt");
txt.onfocus = function(){
//友好提示
var span = document.getElementById("action");
span.innerHTML = "用戶名格式最小8位";
span.style.color = "green";
};
txt.onblur = function(){
//錯(cuò)誤提示
var span = document.getElementById("action");
span.innerHTML = "對不起 格式不正確";
span.style.color = "red";
};
</script>
onmouseover:鼠標(biāo)懸浮的事件 onmouseout:鼠標(biāo)離開的事件
需求：div元素 鼠標(biāo)移入變?yōu)榫G色 移出恢復(fù)原色
#d1{background-color: red;width:200px;height: 200px;}
<div id="d1"></div>
<script type="text/javascript">
var div = document.getElementById("d1");
div.onmouseover = function(){
this.style.backgroundColor = "green";
};
div.onmouseout = function(){
this.style.backgroundColor = "red";
};
</script>
onload:加載完畢的事件
等到頁面加載完畢在執(zhí)行onload事件所指向的函數(shù)
<span id="span"></span>
<script type="text/javascript">
window.onload = function(){
var span = document.getElementById("span");
alert(span);
span.innerHTML = "hello js";
};
</script>
2赂蠢、事件的綁定方式
(1)將事件和響應(yīng)行為都內(nèi)嵌到html標(biāo)簽中
<input type="button" value="button" onclick="alert('xxx')"/>
(2)將事件內(nèi)嵌到html中而響應(yīng)行為用函數(shù)進(jìn)行封裝
<input type="button" value="button" onclick="fn()" />
<script type="text/javascript">
function fn(){
alert("yyy");
}
</script>
(3)將事件和響應(yīng)行為 與html標(biāo)簽完全分離
<input id="btn" type="button" value="button"/>
<script type="text/javascript">
var btn = document.getElementById("btn");
btn.onclick = function(){
alert("zzz");
};
</script>
this關(guān)鍵字
this經(jīng)過事件的函數(shù)進(jìn)行傳遞的是html標(biāo)簽對象
<input id="btn" name="mybtn" type="button" value="button123" onclick="fn(this)"/>
<script type="text/javascript">
function fn(obj){
alert(obj.name);
}
</script>
3盏缤、阻止事件的默認(rèn)行為
IE：
window.event.returnValue = false;
W3c:
傳遞過來的事件對象.preventDefault();
例子
//ie：window.event.returnValue = false;
//W3c：傳遞過來的事件對象.preventDefault();
//W3c標(biāo)準(zhǔn)
if(e&&e.preventDefault){
alert("w3c");
e.preventDefault();
//IE標(biāo)簽
}else{
alert("ie");
window.event.returnValue = false;
}
//通過事件返回false也可以阻止事件的默認(rèn)行為
<a href="demo11.html" onclick="return false">點(diǎn)擊我吧</a>
4砰蠢、阻止事件的傳播
IE：
window.event.cancelBubble = true;
W3c:
傳遞過來的事件對象.stopPropagation();
例子
if(e&&e.stopPropagation){
alert("w3c");
e.stopPropagation();
//IE標(biāo)簽
}else{
alert("ie");
window.event.cancelBubble = true;
}
六、js的bom
1蛾找、window對象
彈框的方法：
提示框：alert("提示信息");
確認(rèn)框：confirm("確認(rèn)信息");
有返回值：如果點(diǎn)擊確認(rèn)返回true 如果點(diǎn)擊取消 返回false
var res = confirm("您確認(rèn)要?jiǎng)h除嗎？");
alert(res);
輸入框：prompt("提示信息");
有返回值：如果點(diǎn)擊確認(rèn)返回輸入框的文本 點(diǎn)擊取消返回null
var res = prompt("請輸入密碼赵誓？");
alert(res);
open方法：
window.open("url地址");
open("../jsCore/demo10.html");
定時(shí)器：
1）setTimeout
setTimeout(函數(shù),毫秒值);
clearTimeout(定時(shí)器的名稱);
setTimeout(
function(){
alert("xx");
},
3000
);
例子：
var timer;
var fn = function(){
alert("x");
timer = setTimeout(fn,2000);
};
var closer = function(){
clearTimeout(timer);
};
fn();
2）setInterval
setInterval(函數(shù),毫秒值);
clearInterval(定時(shí)器的名稱)
var timer = setInterval(
function(){
alert("nihao");
},
2000
);
var closer = function(){
clearInterval(timer);
};
需求：注冊后5秒鐘跳轉(zhuǎn)首頁
<script type="text/javascript">
var time = 5;
var timer;
timer = setInterval(
function(){
var second = document.getElementById("second");
if(time>=1){
second.innerHTML = time;
time--;
}else{
clearInterval(timer);
location.href="../jsCore/demo10.html";
}
},
1000
);
</script>
恭喜您注冊成功打毛，<span id="second" style="color: red;">5</span>秒后跳轉(zhuǎn)到首頁
如果不跳轉(zhuǎn)請<a href="../jsCore/demo10.html">點(diǎn)擊這里</a>
2、location
location.href="url地址";
3俩功、history
back();
forward();
go();
<a href="demo7.html">后一頁</a>
<input type="button" value="上一頁" onclick="history.back()">
<input type="button" value="下一頁" onclick="history.forward()">
<input type="button" value="上一頁" onclick="history.go(-1)">
<input type="button" value="下一頁" onclick="history.go(1)">
七幻枉、js的dom
1、文檔對象模型
html文件加載到內(nèi)存之后會(huì)形成一顆dom樹诡蜓，根據(jù)這些節(jié)點(diǎn)對象可以進(jìn)行腳本代碼的動(dòng)態(tài)修改
在dom樹當(dāng)中 一切皆為節(jié)點(diǎn)對象
節(jié)點(diǎn)的類型：
- 元素節(jié)點(diǎn)
- 屬性節(jié)點(diǎn)
- 文本節(jié)點(diǎn)
2熬甫、dom方法和屬性
屬性
(1)nodeName
String 節(jié)點(diǎn)的名字；根據(jù)節(jié)點(diǎn)的類型而定義
如果是元素節(jié)點(diǎn)蔓罚，nodeName返回這個(gè)元素的名稱(標(biāo)簽名)椿肩。
如果是屬性節(jié)點(diǎn)瞻颂，nodeName返回這個(gè)屬性的名稱(屬性名)。
如果是文本節(jié)點(diǎn)郑象，nodeName返回一個(gè)內(nèi)容為#text 的字符串贡这。
(2)nodeType
Number 節(jié)點(diǎn)的類型，常量值之一
Node.ELEMENT_NODE ---1 -- 元素節(jié)點(diǎn)
Node.ATTRIBUTE_NODE ---2 -- 屬性節(jié)點(diǎn)
Node.TEXT_NODE ---3 -- 文本節(jié)點(diǎn)
(3)nodeValue
String 節(jié)點(diǎn)的值厂榛；根據(jù)節(jié)點(diǎn)的類型而定義
如果給定節(jié)點(diǎn)是一個(gè)屬性節(jié)點(diǎn)盖矫，返回值是這個(gè)屬性的值
如果給定節(jié)點(diǎn)是一個(gè)文本節(jié)點(diǎn)，返回值是這個(gè)文本節(jié)點(diǎn)內(nèi)容
如果給定節(jié)點(diǎn)是一個(gè)元素節(jié)點(diǎn)击奶，返回值是 null
(4)父節(jié)點(diǎn)： parentNode
parentNode 屬性返回的節(jié)點(diǎn)永遠(yuǎn)是一個(gè)元素節(jié)點(diǎn)辈双，因?yàn)橹挥性毓?jié)點(diǎn)才有可能包含子節(jié)點(diǎn)。
document 節(jié)點(diǎn)的沒有父節(jié)點(diǎn)柜砾。
(5)子節(jié)點(diǎn)
childNodes：獲取指定節(jié)點(diǎn)的所有子節(jié)點(diǎn)集合湃望。
firstChild：獲取指定節(jié)點(diǎn)的第一個(gè)子節(jié)點(diǎn)。
lastChild：獲取指定節(jié)點(diǎn)的最后一個(gè)子節(jié)點(diǎn)局义。
(6)同輩節(jié)點(diǎn)
nextSibling: 返回一個(gè)給定節(jié)點(diǎn)的下一個(gè)兄弟節(jié)點(diǎn)喜爷。
previousSibling：返回一個(gè)給定節(jié)點(diǎn)的上一個(gè)兄弟節(jié)點(diǎn)。
1.創(chuàng)建
（1）createElement()
按照給定的標(biāo)簽名創(chuàng)建一個(gè)新的元素節(jié)點(diǎn)萄唇。方法只有一個(gè)參數(shù)：將被創(chuàng)建的元素的名字檩帐，是一個(gè)字符串.
var reference = document.createElement(element);
方法的返回值：是一個(gè)指向新建節(jié)點(diǎn)的引用指針。返回值是一個(gè)元素節(jié)點(diǎn)另萤，所以它的 nodeType 屬性值等于 1湃密。
新元素節(jié)點(diǎn)不會(huì)自動(dòng)添加到文檔里，新節(jié)點(diǎn)沒有 nodeParent 屬性四敞，它只是一個(gè)存在于 JavaScript 上下文的對象.
（2）createTextNode()
創(chuàng)建一個(gè)包含著給定文本的新文本節(jié)點(diǎn)泛源。這個(gè)方法的返回值是一個(gè)指向新建文本節(jié)點(diǎn)引用指針。
var textNode = document.createTextNode(text);
方法只有一個(gè)參數(shù)：新建文本節(jié)點(diǎn)所包含的文本字符串
方法的返回值：是一個(gè)指向新建節(jié)點(diǎn)的引用指針忿危。它是一個(gè)文本節(jié)點(diǎn)达箍，所以它的 nodeType 屬性等于 3.
新元素節(jié)點(diǎn)不會(huì)自動(dòng)添加到文檔里，新節(jié)點(diǎn)沒有 nodeParent 屬性
2.移除
removeChild()
從一個(gè)給定元素里刪除一個(gè)子節(jié)點(diǎn)
var reference = element.removeChild(node);
返回值是一個(gè)指向已被刪除的子節(jié)點(diǎn)的引用指針铺厨。
某個(gè)節(jié)點(diǎn)被removeChild()方法刪除時(shí),這個(gè)節(jié)點(diǎn)所包含的所有子節(jié)點(diǎn)將同時(shí)被刪除缎玫。
如果想刪除某個(gè)節(jié)點(diǎn)，但不知道它的父節(jié)點(diǎn)是哪一個(gè)解滓，parentNode 屬性可以幫忙赃磨。
3.替換
replaceChild()
把一個(gè)給定父元素里的一個(gè)子節(jié)點(diǎn)替換為另外一個(gè)子節(jié)點(diǎn)
var reference = element.replaceChild(newChild,oldChild);
返回值是一個(gè)指向已被替換的那個(gè)子節(jié)點(diǎn)的引用指針。
如果被插入的子節(jié)點(diǎn)還有子節(jié)點(diǎn)洼裤，則那些子節(jié)點(diǎn)也被插入到目標(biāo)節(jié)點(diǎn)中
4.查找
（1）getElementById()
尋找一個(gè)有著給定 id 屬性值的元素邻辉，返回值是一個(gè)有著給定 id 屬性值的元素節(jié)點(diǎn)。如果不存在這樣的元素，它返回 null.
var oElement = document.getElementById ( sID )
該方法只能用于 document 對象
（2）getElementsByName()
尋找有著給定name屬性的所有元素值骇，這個(gè)方法將返回一個(gè)節(jié)點(diǎn)集合莹菱，這個(gè)集合可以當(dāng)作一個(gè)數(shù)組來處理。這個(gè)集合的 length 屬性等于當(dāng)前文檔里有著給定name屬性的所有元素的總個(gè)數(shù)雷客。
（3）getElementsByTagName()
尋找有著給定標(biāo)簽名的所有元素芒珠，這個(gè)方法將返回一個(gè)節(jié)點(diǎn)集合，這個(gè)集合可以當(dāng)作一個(gè)數(shù)組來處理搅裙。這個(gè)集合的 length 屬性等于當(dāng)前文檔里有著給定標(biāo)簽名的所有元素的總個(gè)數(shù)皱卓。
（4）hasChildNodes()
該方法用來檢查一個(gè)元素是否有子節(jié)點(diǎn)，返回值是 true 或 false.
var booleanValue = element.hasChildNodes();
文本節(jié)點(diǎn)和屬性節(jié)點(diǎn)不可能再包含任何子節(jié)點(diǎn)部逮，所以對這兩類節(jié)點(diǎn)使用 hasChildNodes 方法的返回值永遠(yuǎn)是 false.
如果 hasChildNodes 方法的返回值是 false娜汁，則 childNodes,firstChild,lastChild 將是空數(shù)組和空字符串。
（5）getAttribute()
返回一個(gè)給定元素的一個(gè)給定屬性節(jié)點(diǎn)的值
var attributeValue = element.getAttribute(attributeName);
給定屬性的名字必須以字符串的形式傳遞給該方法兄朋。
給定屬性的值將以字符串的形式返回掐禁，如果給定屬性不存在，getAttribute() 將返回一個(gè)空字符串.
通過屬性獲取屬性節(jié)點(diǎn)
getAttributeNode(屬性的名稱)--Node
（6）setAttribute()
將給定元素節(jié)點(diǎn)添加一個(gè)新的屬性值或改變它的現(xiàn)有屬性的值颅和。
element.setAttribute(attributeName,attributeValue);
屬性的名字和值必須以字符串的形式傳遞給此方法
如果這個(gè)屬性已經(jīng)存在傅事，它的值將被刷新；
如果不存在峡扩，setAttribute()方法將先創(chuàng)建它再為其賦值蹭越。
5.插入
（1）appendChild()
為給定元素增加一個(gè)子節(jié)點(diǎn)：
var newreference = element.appendChild(newChild).
給定子節(jié)點(diǎn) newChild 將成為給定元素節(jié)點(diǎn) element 的最后一個(gè)子節(jié)點(diǎn)。
方法的返回值是一個(gè)指向新增子節(jié)點(diǎn)的引用指針教届。
該方法通常與 createElement() createTextNode() 配合使用
新節(jié)點(diǎn)可以被追加給文檔中的任何一個(gè)元素
（2）insertBefore()
把一個(gè)給定節(jié)點(diǎn)插入到一個(gè)給定元素節(jié)點(diǎn)的給定子節(jié)點(diǎn)的前面
var reference = element.insertBefore(newNode,targetNode);
節(jié)點(diǎn) newNode 將被插入到元素節(jié)點(diǎn) element 中并出現(xiàn)在節(jié)點(diǎn) targetNode 的前面.
節(jié)點(diǎn) targetNode 必須是 element 元素的一個(gè)子節(jié)點(diǎn)响鹃。
該方法通常與 createElement() 和 createTextNode() 配合使用
