DOM

節(jié)點(diǎn)層次

Node類(lèi)型 數(shù)值
Element元素 1
ATTRIBUTE屬性 2
TEXT文本 3
CDATA(只針對(duì)XML文檔) 4
ENTITY_REFRENCE 5
ENTITY 6
PROCESSING_INSTRUCTION 7
COMMENT 8
DOCUMENT文檔 9
DOCUMENT_TYPE文檔類(lèi)型 10
DOCUMENT_FRAGMENT 11
NOTATION 12

nextSibling ,previousSibling,
firstChild,lastChild,
parentNode,childNodes,
hasChildNodes(),

ownerDocument //每個(gè)節(jié)點(diǎn)都有,指向整個(gè)文檔的文檔節(jié)點(diǎn)
操作節(jié)點(diǎn)
appendChild():向ChildNodes列表的末尾添加一個(gè)節(jié)點(diǎn)。
如果節(jié)點(diǎn)本來(lái)就是文檔的一部分,則將該節(jié)點(diǎn)由原來(lái)的位置移到文檔末尾
insertBefore(????????????????????????????要插入的節(jié)點(diǎn),參照節(jié)點(diǎn))??:插入節(jié)點(diǎn)在參照節(jié)點(diǎn)之后。
replaceChild(要插入的節(jié)點(diǎn),要替換的節(jié)點(diǎn))
removeChild(要移除的節(jié)點(diǎn))
cloneNode(true):復(fù)制節(jié)點(diǎn)及其整個(gè)子節(jié)點(diǎn)樹(shù);
cloneNode(false):只復(fù)制該節(jié)點(diǎn);
cloneNode()不會(huì)復(fù)制節(jié)點(diǎn)的Javascript屬性,如事件處理程序。

Document

document.documentElement //取得對(duì)??????<html>的????引用
document.doctype //取得對(duì)??????<!DOCTYPE>的????引用
document.title //取得文檔標(biāo)題
document.URL //取得文檔URL
document.domain //取得文檔域名
document.referrer //取得來(lái)源頁(yè)面的URL

document.anchors //包含文檔中所有帶name特性的a元素
document.form //文檔中所有的Form元素
document.images //文檔中所有的image元素
document.links //包含文檔中所有帶href特性的a元素

document.implementation //DOM一致性檢測(cè),有一個(gè)方法hasFeature()

FORM

caption:保存對(duì)<caption>元素的指針
tBodies:一個(gè)<tbody>元素的HTMLCollection
tFoot:保存對(duì)<tfoot>元素的指針
tHead:保存對(duì)<thead>元素的指針
rows:一個(gè)表格中所有行的HTMLCollection
createTHead():創(chuàng)建<thead>元素
createTFoot():創(chuàng)建<tfoot>元素
createCaption():創(chuàng)建<caption>元素
deleteTHead():刪除<thead>元素
deleteTFoot():刪除<tfoot>元素
deleteCaption():刪除<caption>元素
deleteRow(pos):刪除指定位置的行
insertRow(pos):向rows集合中的指定位置插入一行
cells:保存著??????<tr>元素????中單元格???????? HTMLCollection
deleteCell(pos):刪除指定位置的單元格
insertCell(pos):向cells集合的指定位置插入一行

//創(chuàng)建表格
var table = document.createElement("table");
table.border=1;
table.width="100";

//創(chuàng)建tbody
var tbody = document.createElement("tbody");
table.appendChild(tbody);

//創(chuàng)建第一行
tbody.insertRow(0);
tbody.rows[0].insertCell(0);
tbody.rows[0].cells[0].appendChild(document.createTextNode("Cell 1,1"));
tbody.rows[0].insertCell(1);
tbody.rows[0].cell[1].appendChild(document.createTextNode("Cell 2,1"));

//創(chuàng)建第二行
tbody.insertRow(1);
tbody.rows[1].insertCell(0);
tbody.row[1].Cell[0].appendChild(document.createTextNode("Cell 2,1"));
tbody.rows[1].insertCell(1);
tbody.row[1].Cell[1].appendChild(document.createTextNode("Cell 2,2"));

//將表格添加到文檔主體中
document.body.appendChild(table);
最后編輯于
?著作權(quán)歸作者所有,轉(zhuǎn)載或內(nèi)容合作請(qǐng)聯(lián)系作者
平臺(tái)聲明:文章內(nèi)容(如有圖片或視頻亦包括在內(nèi))由作者上傳并發(fā)布,文章內(nèi)容僅代表作者本人觀(guān)點(diǎn),簡(jiǎn)書(shū)系信息發(fā)布平臺(tái),僅提供信息存儲(chǔ)服務(wù)。

推薦閱讀更多精彩內(nèi)容

  • DOM是針對(duì)HTML和XML文檔的一個(gè)API。DOM描繪了一個(gè)層次化的節(jié)點(diǎn)樹(shù),允許開(kāi)發(fā)人員添加、移除和修改頁(yè)面的某...
    給我一炷香的時(shí)間閱讀 528評(píng)論 0 1
  • 本章內(nèi)容 理解包含不同層次節(jié)點(diǎn)的 DOM 使用不同的節(jié)點(diǎn)類(lèi)型 克服瀏覽器兼容性問(wèn)題及各種陷阱 DOM 是針對(duì) HT...
    悶油瓶小張閱讀 668評(píng)論 0 1
  • DOM(文檔對(duì)象模型)是針對(duì) HTML 和 XML 文檔的一個(gè) API。DOM 描繪了一個(gè)層次化的節(jié)點(diǎn)樹(shù),允許開(kāi)發(fā)...
    劼哥stone閱讀 818評(píng)論 8 6
  • 一個(gè)傳統(tǒng)的女性,要相夫教子、賢惠溫柔,要上得廳堂、下得廚房,現(xiàn)在我聽(tīng)說(shuō)誰(shuí)誰(shuí)的老婆很賢惠,我反而很同情她,我覺(jué)得...
    美麗小花的豬閱讀 695評(píng)論 7 6
  • 好吃的f
    搖擺的奶嘴閱讀 154評(píng)論 0 0