<em id="09ttv"></em>
    <sup id="09ttv"><pre id="09ttv"></pre></sup>
    <dd id="09ttv"></dd>

        • DOM常見的操作方式有哪些

          2018-6-22    seo達(dá)人

          如果您想訂閱本博客內(nèi)容,每天自動(dòng)發(fā)到您的郵箱中, 請點(diǎn)這里

          1.什么是DOM

          DOM 是 Document Object Model(文檔對(duì)象模型)的縮寫。


          DOM是中立于平臺(tái)和語言的接口,它允許程序和腳本動(dòng)態(tài)地訪問和更新文檔的內(nèi)容、結(jié)構(gòu)和樣式。


          在 HTML DOM中,所有事物都是節(jié)點(diǎn)。DOM 是被視為節(jié)點(diǎn)樹的 HTML。


          什么是節(jié)點(diǎn)
          2.什么是DOM節(jié)點(diǎn)
          HTML 文檔中的所有內(nèi)容都是節(jié)點(diǎn)


          整個(gè)文檔是一個(gè)文檔節(jié)點(diǎn)


          每個(gè) HTML 元素是元素節(jié)點(diǎn)


          HTML 元素內(nèi)的文本是文本節(jié)點(diǎn)


          每個(gè) HTML 屬性是屬性節(jié)點(diǎn)


          注釋是注釋節(jié)點(diǎn)


          demo
          3.常見的DOM屬性
          屬性是節(jié)點(diǎn)(HTML 元素)的值,您能夠獲取或設(shè)置。


          innerHTML 屬性
          nodeName 屬性


          nodeName 屬性規(guī)定節(jié)點(diǎn)的名稱


          元素節(jié)點(diǎn)的 nodeName 與標(biāo)簽名相同


          屬性節(jié)點(diǎn)的 nodeName 與屬性名相同


          文本節(jié)點(diǎn)的 nodeName 始終是 #text


          文檔節(jié)點(diǎn)的 nodeName 始終是 #document


          nodeValue 屬性
          nodeValue 屬性規(guī)定節(jié)點(diǎn)的值。


          元素節(jié)點(diǎn)的 nodeValue 是 undefined 或 null


          文本節(jié)點(diǎn)的 nodeValue 是文本本身


          屬性節(jié)點(diǎn)的 nodeValue 是屬性值


          4.訪問元素的方法



          通過使用 getElementById() 方法


          通過使用 getElementsByTagName() 方法


          通過使用 getElementsByClassName() 方法


          5.修改元素的方法
          改變 HTML 內(nèi)容


          document.getElementById("p1").innerHTML="New text!";


          改變 CSS 樣式


          document.getElementById("p2").style.color="blue";


          改html和css
          追加子元素的方法


          首先必須創(chuàng)建該元素(元素節(jié)點(diǎn)),然后把它追加到已有的元素上。var para=document.createElement("p");


          創(chuàng)建新的 HTML 元素 - appendChild() 在父元素的最后追加


          創(chuàng)建新的 HTML 元素-element.insertBefore(para,child);在指定位置給父級(jí)追加子元素


          刪除 HTML 元素,您必須清楚該元素的父元素:parent.removeChild(child);


          替換 HTML 元素:parent.replaceChild(para,child); 方法


          6.DOM - 事件
          允許 JavaScript 對(duì) HTML 事件作出反應(yīng)


          onclick 事件——當(dāng)用戶點(diǎn)擊時(shí)


          onload 事件——用戶進(jìn)入


          onunload 事件——用戶離開


          onmouseover事件——鼠標(biāo)移入


          onmouseout事件——鼠標(biāo)移出


          onmousedown事件——鼠標(biāo)按下


          onmouseup 事件——鼠標(biāo)抬起


          7.參考文獻(xiàn)



          8.更多討論

          問題1:getElementsByClassName() 使用時(shí)需要注意的地方

          回答:它取出來的是個(gè)數(shù)組,及時(shí)只有一個(gè)那也是數(shù)組對(duì)象,所以改變指定元素時(shí)需使用角標(biāo)

          問題2:innerHTML 和innerText的區(qū)別

          回答:innerText替換是會(huì)將標(biāo)簽替換成字符串,而innerHTML 則會(huì)保留標(biāo)簽插入到節(jié)點(diǎn)當(dāng)中

          問題3:dom事件

          回答:事件是文檔或者瀏覽器窗口中發(fā)生的,特定的交互瞬間。事件是用戶或?yàn)g覽器自身執(zhí)行的某種動(dòng)作,如click,load和mouseover都是事件的名字。事件是javaScript和DOM之間交互的橋梁。

          事件發(fā)生,調(diào)用它的處理函數(shù)執(zhí)行相應(yīng)的JavaScript代碼給出響應(yīng)。


          藍(lán)藍(lán)設(shè)計(jì)www.sdgs6788.com )是一家專注而深入的界面設(shè)計(jì)公司,為期望卓越的國內(nèi)外企業(yè)提供卓越的UI界面設(shè)計(jì)、BS界面設(shè)計(jì) 、 cs界面設(shè)計(jì) 、 ipad界面設(shè)計(jì) 、 包裝設(shè)計(jì) 、 圖標(biāo)定制 、 用戶體驗(yàn) 、交互設(shè)計(jì)、 網(wǎng)站建設(shè) 平面設(shè)計(jì)服務(wù)




          日歷

          鏈接

          個(gè)人資料

          存檔

          天天躁日日躁狠狠久久| 国产农村妇女毛片精品久久| 久久精品亚洲精品国产欧美| 久久久久综合网久久| 国内精品久久久久影院网站| 精品久久久久久国产牛牛app| 精品久久人人妻人人做精品 | 中文无码久久精品| 亚洲午夜久久久久久噜噜噜| 久久久国产精品亚洲一区| 99久久免费国产特黄| 91久久九九无码成人网站| 日本亚洲色大成网站WWW久久| 日韩十八禁一区二区久久| 综合久久国产九一剧情麻豆| 亚洲va久久久噜噜噜久久狠狠| a级成人毛片久久| 成人精品一区二区久久久| 久久久久久久久久久精品尤物 | 午夜精品久久久久久久| 久久香蕉综合色一综合色88| 久久精品免费大片国产大片| 狠狠色婷婷久久一区二区| 久久国产成人精品麻豆| 久久久SS麻豆欧美国产日韩| 精品久久久久久中文字幕| 伊人久久大香线蕉综合5g| 国产精品久久久天天影视| 久久天天躁狠狠躁夜夜不卡| 99久久精品久久久久久清纯| 无码精品久久久久久人妻中字 | 久久精品亚洲精品国产欧美| 国产成人久久精品区一区二区| 国产精品久久久久久久app| 99久久精品国产一区二区三区| 久久AV高潮AV无码AV| 亚洲?V乱码久久精品蜜桃 | 国产精品永久久久久久久久久| 久久这里只有精品18| 亚洲va中文字幕无码久久| 中文国产成人精品久久亚洲精品AⅤ无码精品|