国产xxxx99真实实拍_久久不雅视频_高清韩国a级特黄毛片_嗯老师别我我受不了了小说

資訊專欄INFORMATION COLUMN

JS進(jìn)階 - JS 、JS-Web-API與DOM、BOM

Developer / 1029人閱讀

摘要：與常說的瀏覽器執(zhí)行的有兩部分基礎(chǔ)語法標(biāo)準(zhǔn)規(guī)定基礎(chǔ)語法，包括類型變量原型作用域異步標(biāo)準(zhǔn)定義用于瀏覽器中操作頁面的和全局變量，規(guī)定瀏覽器讓開發(fā)者做的事情，沒有規(guī)定相關(guān)基礎(chǔ)語法瀏覽器運(yùn)行既要遵循標(biāo)準(zhǔn)又要遵循標(biāo)準(zhǔn)知識補(bǔ)充內(nèi)置全局函數(shù)和對象全

1.JS 與 JS-Web-API

常說的JS（瀏覽器執(zhí)行的JS）有兩部分：

(1) JS基礎(chǔ)語法：ECMA 262 標(biāo)準(zhǔn)（規(guī)定基礎(chǔ)語法，包括類型變量、原型、作用域、異步）
(2) JS-Web-API：W3C 標(biāo)準(zhǔn) （定義用于瀏覽器中JS操作頁面的API和全局變量，規(guī)定瀏覽器讓開發(fā)者做的事情， W3C 沒有規(guī)定JS相關(guān)基礎(chǔ)語法）

瀏覽器運(yùn)行JS既要遵循 ECMA 262 標(biāo)準(zhǔn) 又要遵循 W3C 標(biāo)準(zhǔn)

知識補(bǔ)充：

JS內(nèi)置全局函數(shù)和對象：
全局對象：window，document等 
全局變量：所有未定義可以直接用的全局變量，例：navigator（var ua = navigator.userAgent 獲取瀏覽器特性）

2.DOM（文檔對象模型 Document Object Model）

XML：可擴(kuò)展的描述語言，描述結(jié)構(gòu)化數(shù)據(jù)（標(biāo)簽名自定義，數(shù)據(jù)結(jié)構(gòu)是樹）
HTML：XML的特殊類型（HTML代碼就是一個字符串）

DOM的基本數(shù)據(jù)結(jié)構(gòu)：樹
DOM的本質(zhì)：瀏覽器把拿到的HTML代碼結(jié)構(gòu)化成瀏覽器可識別，JS可識別可操作的模型

DOM節(jié)點(diǎn)操作：

(1) 獲取DOM節(jié)點(diǎn):

    var div1 = document.getElementById("div1") //獲得元素
    var divList = document.getElementsByTagName("div") //獲得集合（JS對象）
    console.log(divList[0])
    var containerList = document.getElementByClassName(".container") //獲取集合
    var pList = document.querySelectorAll("p") // 獲取集合

(2) prototype JS對象屬性獲取與修改:

    var pList = document.querrySelectorAll("p")
    var p = PList[0]
    cosnole.log(p.style.width) // 獲取樣式
    p.style.width = "100px" //修改樣式
    console.log(p.className) //獲取className
    p.className = "p1" //修改className

(3）Attribute HTML文檔標(biāo)簽屬性獲取與修改:

    var pList = document.querySelectorAll("p")
    var p = pList[0]
    p.getAttribute("data-name")
    p.setAttribute("dataname","immoc")
    p.getAttribute("style")
    p.setAttribute("style","font-size:30px")

DOM結(jié)構(gòu)操作：

(1) 新增節(jié)點(diǎn):

    var div1 = document.getElementById("div1")
    
    方法1 - 添加新節(jié)點(diǎn)：
    var p1 = document.creatElement("p")
    p1.innerHTML = "this is p1"
    div1.appendChild(p1) //添加新創(chuàng)建的元素
    
    方法2 - 移動已有節(jié)點(diǎn)（原先位置不再存在該節(jié)點(diǎn)）：
    var p2 = document.getElementById("p2")
    div1.appendChild(p2)
    
(2) 獲取父元素：
 
    var div1 = document.getElementById("div1")
    var parent = div1.parentElement //元素
    
(3) 獲取子元素節(jié)點(diǎn)：
 
    var div1 = document.getElementById("div1")
    var child = div1.childNodes //獲取集合（childNodes包括空文本 text）
    console.log(div1.childNodes[1].nodeName) // #P
    console.log(div1.childNodes[1].nodeType) // 1 (一般類型為1，text為3)
    
(4) 刪除節(jié)點(diǎn)
    var div1 = document.getElementById("div1")
    var child = div1.childNodes
    div1.removeChild(child[0])

3.BOM（瀏覽器對象模型 Browser Object Model）

1.檢測瀏覽器類型：

var ua = navigator.userAgent //獲取瀏覽器類型
var isChrome = ua.indexOf("Chrome")
console.log(isChrome)

2.解析url的各部分

location:

console.log(location.href) //整個路徑(location.href = ""  //改變路徑地址,在控制臺直接改寫可以直接訪問該網(wǎng)址)
console.log(location.host) //:主機(jī)名
console.log(location.protocol) //協(xié)議http: , https:
console.log(location.pathname) //路徑"/learn/199"
console.log(location.search) // ？之后的參數(shù)（多個參數(shù)&相連）
console.log(location.hash) // #哈希值

知識補(bǔ)充：

screen 屏幕：
console.log(screen.width)
console.log(screen.height)

history 歷史：
history.back()//返回
history.forward()//前進(jìn)

文章版權(quán)歸作者所有，未經(jīng)允許請勿轉(zhuǎn)載,若此文章存在違規(guī)行為，您可以聯(lián)系管理員刪除。

轉(zhuǎn)載請注明本文地址：http://m.specialneedsforspecialkids.com/yun/95128.html

相關(guān)文章

  • 【JS基礎(chǔ)】DOM，BOM，事件綁定，ajax，跨域，存儲

    摘要：常說的瀏覽器執(zhí)行的包含兩部分基礎(chǔ)知識標(biāo)準(zhǔn)標(biāo)準(zhǔn)的內(nèi)容包括事件綁定請求包括協(xié)議存儲標(biāo)準(zhǔn)沒有規(guī)定任何基礎(chǔ)相關(guān)的東西。如果未經(jīng)允許即可獲取，那是瀏覽器同源策略出現(xiàn)了漏洞。 常說的JS（瀏覽器執(zhí)行的JS）包含兩部分 JS基礎(chǔ)知識（ECMA 262 標(biāo)準(zhǔn)） JS-Web-API（W3C 標(biāo)準(zhǔn)） JS-Web-API的內(nèi)容包括 DOMBOM事件綁定ajax請求（包括http協(xié)議）存儲 W3C 標(biāo)...

    zero 評論0 收藏0

  • 前端面試之路二(javaScript基礎(chǔ)整理)

    摘要：在標(biāo)簽中添加屬性，本質(zhì)上是跟在標(biāo)簽里面寫屬性時一樣的，所以屬性值最終都會編譯為字符串類型。這個節(jié)點(diǎn)包括很多，比如，以及一些方法等方法。一個對象有很多，該集合名字為，里面有其他以及，里面有很多。 一、變量類型和計(jì)算 JS中使用typeof能得到哪些類型 變量類型 值類型：變量本身就是含有賦予給它的數(shù)值的，它的變量本身及保存的數(shù)據(jù)都存儲在棧的內(nèi)存塊當(dāng)中 引用類型：引用類型當(dāng)然是分配到...

    AbnerMing 評論0 收藏0

  • 慕課網(wǎng)js面試題學(xué)習(xí)筆記(ES6 標(biāo)準(zhǔn)) ——實(shí)時更新

    摘要：而第一種方法只能判斷引用類型，不能判斷值類型，因?yàn)橹殿愋蜎]有對應(yīng)的構(gòu)造函數(shù)描述一個對象的過程生成一個新的空對象指向這個新對象執(zhí)行構(gòu)造函數(shù)中的代碼，即對賦值將新對象的屬性指向構(gòu)造函數(shù)的屬性返回，即得到新對象。 最近在在看前端面試教程，這篇文章里大部分是看視頻的過程中自己遇到的不清楚的知識點(diǎn)，內(nèi)容很簡單，只是起到一個梳理作用。有些地方也根據(jù)自己的理解在作者的基礎(chǔ)上加了點(diǎn)東西，如有錯誤，歡迎...

    netmou 評論0 收藏0

  • 【連載】前端個人文章整理-從基礎(chǔ)到入門

    摘要：個人前端文章整理從最開始萌生寫文章的想法，到著手開始寫，再到現(xiàn)在已經(jīng)一年的時間了，由于工作比較忙，更新緩慢，后面還是會繼更新，現(xiàn)將已經(jīng)寫好的文章整理一個目錄，方便更多的小伙伴去學(xué)習(xí)。 showImg(https://segmentfault.com/img/remote/1460000017490740?w=1920&h=1080); 個人前端文章整理 從最開始萌生寫文章的想法，到著手...

    madthumb 評論0 收藏0

發(fā)表評論

0條評論

最新活動
閱讀需要支付1元查看
<