本文主要和大家分享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.
修改p中的內容
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 函數()"
相關推薦:
以上是js基礎知識點總結分享的詳細內容。更多資訊請關注PHP中文網其他相關文章!