js基礎知識點總結
如何在一個網站或者一個頁面,去書寫你的js程式碼: 1.js的分層(功能):jquery(tool) 元件(ui) 應用(app),mvc(backboneJs) 2.js的規劃():避免全域性變數和方法(名稱空間,閉包,面向物件),模組化(seaJs,requireJs)
常用內部類:Data Array Math String
HTML屬性,CSS屬性 HTML:屬性.HTML屬性="值"; CSS:物件.style.CSS屬性="值";
class和float 1.class:className 2.float:cssFloat
獲取物件 id:document.getElementById("id 名")
事件:使用者的動作 滑鼠事件: onclick:點選 onmouseover: 滑鼠放上 onmouseout:滑鼠離開 ondbclick:雙擊事件 onmousedown:滑鼠按下 onmouseup:滑鼠擡起 onmousemove滑鼠移動 表單事件: onfocus:獲取焦點 onblur:失去焦點 onsubmit:提交事件 onchange:當發生改變的時候 onreset:重置事件 鍵盤事件: onkeyup:鍵盤擡起 onkeydown:鍵盤按下 onkeypress:鍵盤按鍵一次 視窗時間:onload事件 頁面載入完成之後立刻執行的事件 兩種方式: 1.<script>window.onload=init/*函式名,不能加括號*/;</script> 2.<body onload="init()"></body> event:儲存事件發生時的相關的資訊 當事件發生的時候,event event.clientX:事件發生時的X的座標 event.clientY:事件發生時的Y的座標 event.target:事件源 event:必須通過實際引數的形式傳遞給函式才可以用
<input type = "button" value = "點選" onclick = "fn(event)" >
修改div中的內容 innerHTML:物件中所有的內容(文字內容和標籤內容),一般指的是雙標籤或者容器標籤 innerText:物件中所有的文字內容
document.createElement("標籤名"); document.body.appendChild(物件); removeChild(物件) document.body是body標籤物件 document.documentElement是html標籤物件
ECMAscript,BOM,DOM 1.window:物件最高階 2.BOM:瀏覽器物件: brower object model 3.DOM:文件物件模型:document object model 4.BOM:網頁一開啟就會存在 5.DOM:去操作的程式碼 6.document是連結DOM和BOM document有下級,其他的都沒有下級【多視窗】
window.open("連結","name","設定"); 1.width:設定視窗寬度 2.height:設定視窗高度 3.left:新視窗到左端距離 4.top:新視窗到頂部的距離 5.srollbars:滾動條【yes,no,1,0】 6.toolbar:工具類【yes,no,0】 7.location:位址列 window.close: 關閉視窗 window.close()
建立定時器: 一次性計時器:window.setTimeout("函式()",時間t) 執行:是在時間t之後執行js程式碼【只會執行一次】 時間:以毫秒為單位
反覆性計時器:window.setInterval("函式()",時間t) 時間:以毫秒為單位 執行:是每過時間t就會執行一次js程式碼【n次】
清楚定時器: 清除一次性定時器:window.clearTimeout(定時器名) 清除反覆性定時器:window.clearInterval(定時器名) 注意:要想清除定時器,必須給定時器名字,匿名定時器無法清除
找物件的方法: di:document.getElementById("id名"); 標籤:document.getElementsByTagName("標籤名")//獲取的是物件的集合(陣列) 物件.getElementByTagName(標籤名) name:document.getElementByName("name名");//form集合(陣列) className:document.getElementByClassName("class名");//集合(陣列)【firefox】 document.images;//獲取img物件(陣列) document.links;//獲取連結物件(陣列) document.forms;//獲取表單物件(陣列) document.body;//body標籤物件 document.documentElement;//HTML物件 event:事件資訊物件 this:當前物件
location物件 location.href:返回url資訊【可以獲取url資訊,也可以給其賦值,實現跳轉頁面】 location.assign():載入新的文件【跳轉頁面】 location.reload():重新載入當前的文件【重新整理頁面】 location.replace():用新的文件替代當前的文件【跳轉頁面】
location.assign和location.replace的區別: location.assign:會產生歷史記錄 location.replace:不會產生歷史記錄
history物件: history.length:瀏覽過的url數量 history.back():返回歷史記錄的前一個頁面 history.forward():載入歷史記錄中的下一個頁面 history.go(n):跳轉到歷史記錄中指定的頁面,如果是-1實際上就是history.back()的功能
screen物件 screen.height:獲取螢幕的高度 screen.width:獲取螢幕的寬度 screen.availHeight:獲取除去工作列的高度 screen.availWidth:獲取除去工作列的寬度
navigator物件 navigator.appName:瀏覽器名 navigator.appCodeName:瀏覽器程式碼名 navigator.appVersion:瀏覽器的版本號和平臺資訊 navigator.userAgent:瀏覽器資訊
DOM:描述網頁各個組成部分的關係 var obj = document.getElementById("id名") 火狐瀏覽器中空白處也算一個節點 parentNode:父節點 childNodes:子節點 firstChild:第一個子節點 lastChild:最後一個子節點 nextSibling:下一個兄弟節點【注意:必須是同父級關係】 previousSiblind:前一個兄弟節點【注意:必須是同父級關係】
登入驗證: onsubmit:表單提交事件 onsubmit="return 函式()"