細看JS中的BOM、DOM對象
DOM對象模型
DOM（Document Object Model），是指文檔對象模型，是W3C組織推薦的處理可擴展標誌語言的標準編程接口。在網頁上，組織頁面（或文檔）的對象被組織在一個樹形結構中，用來表示文檔中對象的標準模型。
【DOM樹節點】
DOM節點分爲三大類：元素節點，文本節點，屬性節點：
文本節點，屬性節點爲元素節點的兩個子節點；
經過getElment系列方法，能夠去到元素節點；
【查看節點】
1.getElementById：經過id獲取惟一的節點；多個同名ID只會取到第一個；
2.etElementByName：經過name取到一個數組，包含1到多個節點；
使用方式：經過循環取到每一個節點，循環次數，從0開始<數組.length
[查看設置屬性節點]
1.查看屬性節點：getAttribute("屬性名")
2.設置屬性節點：setAttribute("屬性名""屬性值")*/
【js修改樣式總結】
一、.className:爲元素設置一個新的clas名字；
div1.className="class1";
二、.style：爲元素設置新的樣式，注意駝峯命名法；
div1.style.backgroundColor="red";
三、.style.cssText:爲元素同時修改多個樣式；
div1.style.cssText="width:100px;height:100px";
[查看節點]
1.tagname：獲取節點的標籤名；
2.innerHTML：設置或者獲取節點內部的全部HTML代碼；
3.innerText：設置或者獲取節點內部的全部文字；
獲取行內樣式的方法：var div=document.getElementsByTagName("div")；
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>DOM代碼詳述（一）</title>
<script type="text/javascript">
window.onload = function(){
var div1 = document.getElementById("div1");//經過ID獲取惟一的節點；多個同名ID只會取第一個
console.log(div1);
console.log(div1.tagName);//查看節點：①屬性；獲取節點的標籤名
console.log(div1.innerHTML);//②設置或者獲取節點內部的全部HTML代碼
console.log(div1.innerText);//③設置或者獲取節點內部的全部文字
console.log(window.getComputedStyle(div1,null));//查看全部屬性（非IE屬性）
console.log(div1.currentStyle);//查看全部屬性（IE屬性）
}
function getById(){
//取到元素節點的樣式屬性節點
var div1 = document.getElementById("div1").style;//獲取
div1.backgroundColor = "#FF00FF";//行級樣式表權重1000;全部節點屬性，一概駝峯命名法
//取到元素節點
var divDoc = document.getElementById("div1");//獲取
divDoc.innerHTML = "<s>king_land</s>";//重置修改div中的HTML代碼
}
//——————————————分割線——————————————————
function getByName(){//經過Name取到一個數組，包含1到多個節點;
var div = document.getElementsByName("div1");
console.log(div.length);
//使用方式：經過循環，取到每個節點，循環次數從0開始，<數組.length
for(var n = 0 ;n < div.length ; n++){
div[n].style.backgroundColor = "#FFFF00";
}
//div1.backgroundColor = "#FFFF00";
//div[0].style.backgroundColor = "#FFFF00";//★
}
//——————————————分割線——————————————————
//document.getElementsByTagName();//同Name
function getByTagName(){
var div = document.getElementsByTagName("div");
div[0].style.backgroundColor = "#00FF00";
}
//——————————————分割線——————————————————
//document.getElementsByClassName();//同Name
function getByClass(){
var div = document.getElementsByClassName("div1");
div[0].style.backgroundColor = "#00FFFF";
}
//——————————————分割線——————————————————
function getAttr () {
var img1 = document.getElementById("img1");
alert(img1.getAttribute("src"));
}//查看屬性節點 getAttribute("屬性名");
//——————————————分割線——————————————————
function setAttr () {
var img1 = document.getElementById("img1");
img1.setAttribute("src","../../2-CSS基礎語法/img/bg_flower_multi.gif");
img1.setAttribute("style","width: 100px;height: 100px;");
}//設置屬性節點 getAttribute("屬性名","屬性值");
//——————————————分割線——————————————————
//JS修改樣式總結
//一、.className：爲元素設置一個新的class名字 例如：div1.className = "div2";
//二、.style：爲元素設置新的樣式 例如：div1.style.background-color = "blue";
//三、.style.cssText：爲元素同時修改多個樣式 例如：div1.style.cssText = "width:100px;height:200px;";
</script>
<style type="text/css">
.div1{
height: 100px;
width: 100px;
background-color: #000000;
color: #FFFFFF;
line-height: 100px;
text-align: center;
}
</style>
</head>
<body>
<div id="div1" name="div1" class="div1">
這裏是測試區
</div>
<div id="div1" name="div1" class="div1">
這裏是測試區
</div>
<div id="div1" name="div1" class="div1">
這裏是測試區
</div>
<img src="../../2-CSS基礎語法/img/bg_flower_multi.gif" id="img1"/>
<br />
<button onclick="getById()">經過ID修改divcolor</button>
<br />
<button onclick="getByName()">經過Name修改divcolor</button>
<br />
<button onclick="getByTagName()">經過TagName修改divcolor</button>
<br />
<button onclick="getByClass()">經過ClassName修改divcolor</button>
<br />
<button onclick="getAttr()">取到img的src屬性值</button>
<br />
<button onclick="setAttr()">修改img的src屬性值</button>
</body>
</html>
[獲取層次節點的經常使用屬性]：javascript
一、.childNodes：（數組）獲取元素的全部子節點（元素節點：子標籤、文本節點）；
二、 .firstChild：獲取元素的第一個子節點；
三、.lastChild:獲取元素的最後一個子節點；
四、.ownerDocument:獲取當前文檔根節點，在html中，爲doucument節點；
五、.parentNode：:獲取當前文檔父節點；
六、.previousSibling：獲取當前節點的前一個兄弟節點
七、.nextSibling：獲取當前節點的後一個兄弟節點；
八、.attributes：獲取當前節點的全部屬性節點；
【注意】：上述屬性均會得到全部元素節點和文本節點，若是隻須要元素節點，須要使用對應的Element屬性，例如： .firstChild->.firstElementChild
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title></title>
<script type="text/javascript">
window.onload = function (){
//獲取層次節點的經常使用屬性
var ul1 = document.getElementById("ul1");
// var lis = ul1.getElementsByTagName("li"); //只取到ul1中全部li
// var lis = document.getElementsByTagName("li"); //取到頁面中全部的li
console.log(ul1.childNodes);//獲取元素的全部子節點（包含元素節點、文本節點）
console.log(ul1.firstChild);//獲取元素的第一個子節點
console.log(ul1.lastChild);//獲取元素的最後一個子節點
console.log(ul1.ownerDocument);//獲取當前文檔根節點，在html文檔中爲document節點
console.log(ul1.parentNode);//獲取當前節點的父節點
console.log(ul1.previousSibling);//獲取當前節點的前一個兄弟節點
console.log(ul1.nextSibling);//獲取當前節點的後一個兄弟節點
//上述屬性均會得到全部的元素節點和文本節點，若是隻須要元素節點，須要使用對應Element屬性，例如：firstChild→firstElementChild
console.log(ul1.attributes);//獲取當前節點的全部屬性節點
}
//——————————————建立並新增節點——————————————————
//方法一：.creatElement("標籤名")建立一個新節點，須要配合setAttribute()方法設置屬性；
//方法二：.appendChild(節點名)在元素的最後追加一個新節點
//方法三：.insertBefore(新節點名,目標節點名)：將新節點插入到目標節點以前
//方法四：克隆對象.cloneNode(true/false)：須要克隆誰，就用誰去調用克隆節點；傳遞參數能夠爲true/false，true表示克隆當前節點及子節點；false表示只克隆當前節點，不克隆子節點。
function appendImg(){
//一、建立一個圖片節點
var img = document.createElement("img");
//二、給img節點設置屬性
img.setAttribute("src","../../1-HTML基本標籤/ivicon.png");
//三、將設置好的img節點追加到body最後
document.body.appendChild(img)//.setAttribute("src","../../img/2017-02-25_143342.png");
}
function insertImg(){
//一、建立一個圖片節點
var img = document.createElement("img");
//二、給img節點設置屬性
img.setAttribute("src","../../1-HTML基本標籤/ivicon.png");
//三、在兩個ul之間插入圖片
var ul2 = document.getElementById("ul2");
document.body.insertBefore(img,ul2);
}
var count = 2;
function copyUl(){
//一、取到ul2節點
var ul2 = document.getElementById("ul2");
//二、克隆節點
var ul2Clon = ul2.cloneNode(true);
count ++;
ul2Clon.setAttribute("id","ul"+count)
//三、在原ul2節點以前，插入新克隆節點
document.body.insertBefore(ul2Clon,ul2);
}
//——————————————刪除和替換節點——————————————————
//一、.removeChild(需刪除節點)：從父容器中刪除指定節點；
//二、.replaceChild(新節點，被替換節點)：用新節點替換被指定節點，若是新節點爲頁面中已有節點，會將此節點刪除後替換到指定節點。
function deleteUl1(){
//取到ul1
var ul1 = document.getElementById("ul1");
if (ul1){
//從父容器body中刪除ul1節點
document.body.removeChild(ul1);
}else{
alert("憋刪了，早沒了");
}
}
function ul1ReplaceUl2(){
var div = document.createElement("div");
div.setAttribute("style","width: 100px;height: 100px;background-color: #20B2AA;");
var ul2 = document.getElementById("ul2");
document.body.replaceChild(div,ul2);
}
</script>
<style type="text/css">
ul{
width: 600px;
list-style: none;
padding: 0;
background-color: #20B2AA;
display: flex;
justify-content: space-around;
margin-top: 20px;
}
</style>
</head>
<body>
<ul id="ul1">
<li>第一項</li>
<li>第二項</li>
<li>第三項</li>
<li>第四項</li>
</ul>
<ul id="ul2">
<li>第1項</li>
<li>第2項</li>
<li>第3項</li>
<li>第4項</li>
</ul>
<button onclick="appendImg()">在最後插入一幅圖片</button>
<button onclick="insertImg()">在兩個ul之間插入一幅圖片</button>
<button onclick="copyUl()">copy一個ul2</button>
<br />
<button onclick="deleteUl1()">刪除ul1</button>
<button onclick="ul1ReplaceUl2() ">用ul1替換ul2</button>
</body>
</html>
[建立新增節點]：css
一、.createElement("標籤名")：建立一個新的節點，須要配合.setAttribute()方法設置新節點的相關屬性；
二、.appendChild(節點名)：在某元素的最後追加一個新節點；
三、.insertBefore(新節點名，目標節點名)：將新節點插入到目標節點以前
四、克隆節點 .cloneNode(true/false):須要克隆誰，就用誰去調用克隆對象；
傳遞參數能夠是(true/false)；
true：爲科隆當前節點和全部子節點；
false：之科隆當前節點，不克隆子節點（默認）；
[刪除替換節點]
一、.removeChild(需刪除節點)：從父容器中，刪除指定節點;
二、.replaceChild(，新節點，被替換節點)：用新節點替換指定節點，若是新節點爲頁面中已有節點會刪除後替換指定節點
function deleteUl1(){
//取到ul1
var ul1=document.getElementById("ul1");
//從ul的父容器刪除ul1
if(ul1){
document.body.removeChild(ul1);
}else{
alert("ul1已經不存在");
}
}
【表格對象】
一、rows屬性：返回表格中的全部行，數組;
二、insertRow(index)：在表格的第index+1行，插入新行;
3.deleteRow():刪除表格的第index+1行;
【表格行對象】：
一、cells屬性：返回表格中的全部行，數組;
二、rowIndex：返回當前行，在表格中的索引順序，從0開始;
三、indexCell(index):在表格的第index+1處插入一個<td>;
四、deleteCell(index):刪除當前行的第index+1個<td>;
【表格的單元格對象】：
1.cellIndex屬性：返回單元格在該行的索引順序，從0開始;
二、innerHTML屬性：返回或設置當前單元格中的HTML代碼;
三、align屬性：設置當前單元格的水平對齊方式;
四、claaName屬性：設置單元格的class屬性;
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>DOM操做表格</title>
<script type="text/javascript">
//表格對象：
//一、rows屬性：返回表格中的全部行，數組；
//二、insertRow(index)：在表格的第index+1行，插入一個新行；
//三、deleteRow(index)：刪除表格的第index+1行；
//表格的行對象：
//一、cells屬性：返回當前行中的全部單元格，數組；
//二、rowIndex屬性：返回當前行在表格中的索引順序，從0開始；
//三、insertCell(index)：在當前行的index+1處插入一個td；
//四、deleteCell(index)：刪除當前行的第index+1個td；
//表格的單元格對象：
//一、cellIndex屬性：返回單元格在該行的索引順序，從0開始；
//二、innerHTML屬性：設置或者返回當前單元格中的HTMl代碼；
//三、align（valign）屬性：設置當前單元格的水平對齊方式；
//四、className屬性：設置單元格的class名稱。
function newRow(){
var book = prompt("書名：");
var price = prompt("價格：");
var table = document.getElementsByTagName("table");
//在表格的最後一行插入一個新行
var newRow = table[0].insertRow(table[0].rows.length-1);
//給新行設置單元格
var cell0 = newRow.insertCell(0);
cell0.innerHTML = book;
var cell1 = newRow.insertCell(1);
cell1.innerHTML = price;
getSum();
}
function deleteRow(){
var table = document.getElementsByTagName("table");
if(table[0].rows.length>2){
table[0].deleteRow(table[0].rows.length-2);
}else{
alert("刪刪刪！刪你妹啊刪！")
}
getSum();
}
function changeTitle(){
var color = prompt("請輸入6位十六進制顏色值：");
var table = document.getElementsByTagName("table");
table[0].rows[0].style = "background-color:#"+color;
}
function copyRow(){
var table = document.getElementsByTagName("table");
var copyRow = table[0].rows[table[0].rows.length-2].cloneNode(true);
var heJi = table[0].rows[table[0].rows.length-1];
//因爲瀏覽器，自動將表格的<tr>包裹在<tbody>中
//因此<tr>實際並不是<table>的子節點，故需取到<table>中的<tbody>進行插入；
if(table[0].rows.length>2){
table[0].getElementsByTagName("tbody")[0].insertBefore(copyRow,heJi);
}else{
alert("沒有能夠複製的行");
}
getSum();
}
function getSum(){
//取到當前表格 表格全部行
var table = document.getElementsByTagName("table");
var rows = table[0].rows;
//
if(rows.length<=2){
rows[rows.length-1].cells[1].innerText = 0 + "元";
alert("沒有可計算的行！");
return;
}
//求和
var sum = 0 ;
for(var i = 1 ; i <= rows.length-2 ; i++){//第0行與最後一行捨棄1 rows.length-2
var cells = rows[i].cells;//取到單元格
sum += parseFloat(cells[cells.length-1].innerText);//最後一個單元格的 內容（innerText） 轉化成數字並求和計算！
}
rows[rows.length-1].cells[cells.length-1].innerText = sum.toFixed(2) + "元";
}
window.onload = function(){
getSum();
}
</script>
<style type="text/css">
table{
border-collapse: collapse;
width: 400px;
text-align: center;
color: #585858;
}
td,th{
border: 1px solid #8B8A8B;
}
table tr:last-child{
color: #E70014;
}
</style>
</head>
<body>
<table>
<tr>
<th>書名</th>
<th>價格</th>
</tr>
<tr>
<td>看得見風景的房間</td>
<td>30.00元</td>
</tr>
<tr>
<td>幸福從天而降</td>
<td>18.50元</td>
</tr>
<tr>
<td>60個瞬間</td>
<td>32.00元</td>
</tr>
<tr>
<td>合計</td>
<td></td>
</tr>
</table>
<br />
<button onclick="newRow()">增長一行</button>
<button onclick="deleteRow()">刪除最後一行</button>
<button onclick="changeTitle()">修改標題樣式</button>
<button onclick="copyRow()">複製最後一行</button>
</body>
</html>
BOM(Browser Object Model) 是指瀏覽器對象模型
【screen對象】
console.log(screen);
console.log(screen.width); //屏幕寬度；
console.log(screen.height); //屏幕高度；
console.log(screen.availWidth);//屏幕可用寬度；
console.log(screen.availHeight);//屏幕可用高度=屏幕高度-底部任務欄高度；
location對象
location完整的URL路徑：
1.協議：//主機名（IP地址）：端口號(默認80端口)/文件路徑？傳遞參數(參數名=參數值name1=value1&name2=value2)#錨點*/
console.log(location.href);//完整路徑
console.log(location.protocol);//使用的協議http：https:ftp:file:mailto:
console.log(location.pathname);//文件路徑
console.log(location.port);//端口號
console.log(location.search);//從？開始的部分
console.log(location.hostname);//主機名（IP地址）
console.log(location.host);//主機名+端口號
console.log(location.hash);//從#開始的錨點
window.location="http://www.baidu.com";//使用JS跳轉頁面
function locationAssign(){
location.assign("http://www.baidu.com");
加載新文檔，加載以後，能夠回退；
}
function locationReplace(){
location.replace("http://www.baidu.com");
使用新的文檔，替換當前文檔，替換以後不能回退；
}
function locationReload(){
從新加載當前頁面
reload(true)：從服務器從新加載頁面
reload()：在本地刷新當前頁面*/
location.reload(true);
}
console.log(history.length);
瀏覽歷史列表的個數
history.forward();前進到前一個頁面；
history.back();前進到後一個頁面；
history.go(-1);跳轉到任意頁面：前一個頁面爲第一個，後一個頁面爲-1個
Navigator 瞭解
console.log(navigator.appName); //產品名稱
console.log(navigator.appVersion); //產品版本號
console.log(navigator.userAgent); //用戶代理信息
console.log(navigator.platform); //系統平臺
navigator.plugins。返回一個數組，檢測瀏覽器安裝的全部插件
>>>主要的屬性：
description:插件的描述信息
filename:插件在本地磁盤的文件名
length:插件的個數
name：插件名
console.log(navigator.plugins);//檢查瀏覽器安裝的插件信息
navigator.mimeTypes 瀏覽器插件，所支持的文件類型
>>>主要屬性
description：MIME類型描述
enabledPlugin：支持此類型的瀏覽器插件
suffixes：此類型可能的後綴名
type：MIME類型的寫法，例如： image/x-icon text/css
console.log(navigator.mimeTypes);//檢查瀏覽器安裝的插件支持的文件類型
【重點】window對象的經常使用方法：
>>>window對象中的全部方法，都可以省略前面的window，好比close（）；
1.prompt：彈窗接受用戶輸入；
2.alert：彈窗警告；
3.confirm：帶有確認/取消按鈕的提示框；
4.close：關閉窗口;
5.open:從新打開一個窗口，傳入參數URL/窗口名稱/窗口特徵;
6.setTimeout:設置延時執行，只會執行一次；
7.setInterval：設置定時器，循環每一個N毫秒執行一次；
兩個參數：須要執行的function/毫秒
8.clearTimeout：清除延時；
9.clearInterval：清除定時器
傳入參數：調用setInterval時返回一個ID，經過變量接受ID，傳入clearInterval；
在這九種方法中，最經常使用到也是這裏面最麻煩的四種是setTimeout/clearTimeout和setInterval/clearInterval，它們兩兩對應，常放在一塊兒搭配使用。下面就給大夥舉一個這方面的栗子~
（栗子：setTimeout/clearTimeout）html
（栗子：setInterval/clearInterval）java
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>首先是setTimeout與clearTimeout</title>
<!--要記得首先打開控制檯喲~-->
<script type="text/javascript">
var timeoutid = setTimeout(function(){
console.log("setTimeout");
},5000) ;
function clearTimeoutBtn(){
clearTimeout(timeoutid);
}
</script>
</head>
<body>
<button onclick="clearTimeoutBtn()">clearTimeout</button>
</body>
</html>
1 <!DOCTYPE html> 2 <html> 3 <head> 4 <meta charset="UTF-8"> 5 <title>而後是setInterval與clearInterval</title> 6 <!--要記得首先打開控制檯喲~--> 7 <script type="text/javascript"> 8 var num = 10; 9 var timeinterval = setInterval(function(){ 10 num--; 11 console.log(num); 12 if (num==0){ 13 clearInterval(timeinterval); 14 } 15 },1000) 16 function clearIntervalBtn(){ 17 clearInterval(timeinterval); 18 } 19 </script> 20 </head> 21 <body> 22 <button onclick="clearIntervalBtn()">clearIntervar</button> 23 </body> 24 </html>
js事件模型
1 DOM0事件模型
1.1 內聯模型：直接將函數名做爲HTML標籤的某個事件屬性的屬性值； 栗子 <button onclick="func()"></button> 缺點：違反了W3C關於HTML與JS分離的基本原則！編程
1.2 腳本模型：在JS腳本中經過事件屬性進行綁定； 栗子 window.onload = function(){} 侷限性：同一節點只能綁定一個同類型事件；數組
2 DOM2事件模型（後面有栗子！）瀏覽器
優勢：同一節點，能夠添加多個同類型事件的監聽器；服務器
①添加事件綁定： IE10以前：btn1.attachEvent("onclick",函數); 其餘瀏覽器：btn1.addEventListener("click",函數,true/false); true：表示事件捕獲；false（默認）：表示事件冒泡 兼容寫法：if(btn1.attackEvent){btn1.attachEvent("onclick",函數);}else{btn1.addEventListener("click",函數,true/false);}
②取消事件綁定： .detachEvent("onclick",函數名); .removeEventListener("click",函數名); 注：若是取消時間幫頂，回調函數必須使用有名函數，而不能使用匿名函數。由於在取消事件幫頂時，須要傳入函數名；app
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>這裏是栗子</title>
<script type="text/javascript">
window.onload = function (){
var btn1 = document.getElementById("btn1");
function func1(){
alert(1);
}
function func2(){
alert(2);
}
btn1.addEventListener("click",func1,false);
btn1.addEventListener("click",func2,false);
var btn2 = document.getElementById("btn2");
btn2.addEventListener("click",function(){
btn1.removeEventListener("click",func1);
},false);
}
</script>
</head>
<body>
<button id="btn1">點我會彈窗！</button>
<br /><br />
<button id="btn2">點我不彈窗！</button>
</body>
</html>
JS中的事件流函數
1 事件冒泡
當某DOM元素觸發某事件時，會從當前DOM元素開始，逐個觸發其祖先元素的同類型事件，直到DOM根節點； DOM0事件流均爲事件冒泡； IE中使用.attachEvent()事件，均爲冒泡； 其餘瀏覽器.addEventListener()添加的事件，當第三個參數爲false時，爲冒泡。
2 事件捕獲
當某DOM元素觸發某事件時，會從DOM根節點，逐個觸發其祖先元素的同類型事件，直到觸發到當前DOM元素開始；
只有使用.addEventListener()添加的事件，而且當第三個參數爲true時，才進行捕獲。
3 阻止事件冒泡
IE瀏覽器：將e.cancelBubble屬性設爲true； 其餘瀏覽器：調用e.stopPropagation();方法
4 取消事件默認行爲
IE瀏覽器：將e.returnValue屬性設爲false； 其餘瀏覽器：調用e.preventDefault(); 方法
（這裏有栗子）：
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>事件流舉慄</title>
<style type="text/css">
#div1{
width: 200px;
height: 200px;
background-color: #20B2AA;
color: #FFFFFF;
font-size: 20px;
font-weight: 700;
}
#div2{
width: 100px;
height: 100px;
background-color: #436690;
color: #FFFFFF;
font-size: 20px;
font-weight: 700;
}
#div3{
width: 50px;
height: 50px;
background-color: #4E2E83;
color: #FFFFFF;
font-size: 20px;
font-weight: 700;
}
</style>
</head>
<body>
<div id="div1">
<div id="div2">
<div id="div3">3</div>
</div>
</div>
<a href="../07 JS中的DOM/筆記.html" onclick="stopHref()">跳轉頁面</a>
</body>
<script type="text/javascript">
var div1 = document.getElementById("div1");
var div2 = document.getElementById("div2");
var div3 = document.getElementById("div3");
div1.addEventListener("click",function(e){
handleE();
console.log("div1觸發了click事件");
},false);
div2.addEventListener("click",function(e){
handleE();
console.log("div2觸發了click事件");
},false);
div3.addEventListener("click",function(e){
handleE();
console.log("div3觸發了click事件");
},false);
function handleE(e){
var evn = e||window.event;
evn.stopPropagation();
}
function stopHref(e){
e = e||window.event;
if (e.preventDefault) {
e.preventDefault(); //IE之外
} else {
e.returnValue = false; //IE
}
alert("好氣呀！");
}
</script>
</html>
相關文章
- 1. JS中的BOM、DOM對象
- 2. JS事件、Bom對象和Dom對象
- 3. BOM對象和DOM對象
- 4. js中的BOM對象
- 5. JS事件、Bom和Dom對象
- 6. js對象(BOM部分/DOM部分)
- 7. JS-進階(對象、BOM、DOM、事件)
- 8. BOM對象和DOM對象的區別
- 9. JavaScript 的 BOM對象 與 DOM對象
- 10. JS-BOM對象
- 更多相關文章...
- • MySQL查看錶中的約束 - MySQL教程
- • XML DOM - CDATASection 對象 - XML DOM 教程
- • C# 中 foreach 遍歷的用法
- • Scala 中文亂碼解決
相關標籤/搜索
每日一句
-
每一个你不满意的现在，都有一个你没有努力的曾经。
歡迎關注本站公眾號,獲取更多信息
相關文章
- 1. JS中的BOM、DOM對象
- 2. JS事件、Bom對象和Dom對象
- 3. BOM對象和DOM對象
- 4. js中的BOM對象
- 5. JS事件、Bom和Dom對象
- 6. js對象(BOM部分/DOM部分)
- 7. JS-進階(對象、BOM、DOM、事件)
- 8. BOM對象和DOM對象的區別
- 9. JavaScript 的 BOM對象 與 DOM對象
- 10. JS-BOM對象