document方法 _document方法有哪些-优快云博客

本文介绍了一个使用DOM(Document Object Model)创建表格的具体实例。通过JavaScript动态生成一个包含三行三列的表格，并设置单元格样式及内容。该示例展示了如何利用DOM方法与属性实现网页元素的创建与操作。

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

<!--document方法： getElementById(id) 返回指定结点的引用 getElementsByTagName(name) 返回文档中所有匹配的元素的集合 createElement(name) 创建指定类型的新结点 createTextNode(text) 创建一个纯文本结点 element方法： getAttribute(id) 返回指定属性的值 setAttribute(id,value) 给属性赋值 removeAttribute(id) 移除指定属性和它的值 getElementsByTagName(name) 返回结点内所有匹配的元素的集合 node方法： appendChild(child) 给指定结点添加一个新的子结点 removeChild(child) 移除指定结点的子结点 replaceChild(newChild,oldChild) 替换指定结点的子结点 insertBefore(newChild,refChild) 在同一层级的结点前面插入新结点 hasChildNodes() 如果结点有子结点则返回true node属性： nodeName 以字符串的格式存放结点的名称 nodeType 以整型数据格式存放结点的类型 nodeValue 以可用的格式存放结点的值 parentNode 指向结点的父结点的引用 childNodes 指向子结点的引用的集合 firstChild 指向子结点结合中的第一个子结点的引用 lastChild 指向子结点结合中的最后一个子结点的引用程序代码 <style> #TableOne{ position:absolute; border:10 ridge #ff9900; top:200 ; left:200; dd:expression(this.οnclick=function(){alert(32)}); </style> <script> function buildTable(){ docBody = document.getElementsByTagName("body").item(0) myTable = document.createElement("TABLE") myTable.id ="TableOne" myTable.border = 1 myTableBody = document.createElement("TBODY") for (i = 0; i < 3; i++){ row = document.createElement("TR") for (j = 0; j < 3; j++){ cell = document.createElement("TD") cell.style.color="red" cell.style.background="#00ffff" cell.width=50 cell.height=20 textVal = "Cell" + i + "_" + j textNode = document.createTextNode(textVal) cell.appendChild(textNode) row.appendChild(cell) } myTableBody.appendChild(row) } myTable.appendChild(myTableBody) docBody.appendChild(myTable) } window.onload = buildTable </script>