以下代码来自 https://developer.mozilla.org/cn/%E4%BD%BF%E7%94%A8Javascript%E5%92%8CDOM_Interfaces%E6%9D%A5%E5%A4%84%E7%90%86HTML#page-tags
var mybody=document.getElementsByTagName("body").item(0);
mytable = document.createElement("TABLE");
mytablebody = document.createElement("TBODY");
for(j=0;j<2;j++) {
mycurrent_row=document.createElement("TR");
for(i=0;i<2;i++) {
mycurrent_cell=document.createElement("TD");
currenttext=document.createTextNode("cell is:"+i+j);
mycurrent_cell.appendChild(currenttext);
mycurrent_row.appendChild(mycurrent_cell);
// 当column为0时,设置单元格背景色;column为1时隐藏单元格
if(i==0) {
mycurrent_cell.style.background="rgb(255,0,0)";
} else {
mycurrent_cell.style.display="none";
}
}
mytablebody.appendChild(mycurrent_row);
}
mytable.appendChild(mytablebody);
mybody.appendChild(mytable);
createElement()创建元素节点
createTextNode()创建文字节点
appendChild()添加节点到某个元素
setAttribute()设置节点的属性
insertBefore()在前端插入
你从上到下的创建元素;然后你从下向上的将子元素接在他们的父元素上
removeChild() 移除节点
分享到:
相关推荐
这篇教程——"JavaScript学习手册十四:HTML DOM-文档元素的操作(二)"深入探讨了如何使用JavaScript来操纵HTML文档中的元素,进一步提升网页动态性和交互性。 DOM是HTML和XML文档的一种结构化表示,它将网页内容...
此“JavaScript 中文开发文档”是针对JavaScript编程的一份详细资源,旨在帮助开发者深入理解和掌握这门语言。 这份文档可能包含以下几个核心部分: 1. **基础语法**:JavaScript的基础包括变量、数据类型(如字符...
首先,文档会介绍API的基础概念,包括如何获取和引用API库,以及如何设置地图的基本元素,如地图容器、基图层和初始视图。开发者需要理解`Map`对象和`MapView`对象的区别,前者表示地图本身,后者则表示地图的视图,...
5. **DOM操作**:讲解如何使用JavaScript操作HTML元素,包括选择元素(querySelector、querySelectorAll)、修改元素属性、添加或删除元素,以及事件处理。 6. **AJAX和Fetch API**:介绍异步编程,包括...
这个压缩包包含了这三个关键领域的帮助文档和JavaScript特效代码,为开发者提供了丰富的参考资料。 首先,让我们深入了解一下CSS。CSS是一种样式表语言,用于描述HTML或XML(包括如SVG、MathML等各种XML方言)文档...
学习这些API文档,开发者可以掌握JavaScript的基础语法,了解如何创建和使用函数、对象,以及如何利用DOM进行页面操作。更重要的是,通过阅读和实践书中的示例,可以提高实际编程能力,理解JavaScript在网页动态化中...
Document对象是JavaScript开发中不可或缺的一部分,它提供了强大的能力来操作HTML文档中的各个元素。掌握Document对象及其相关属性和方法,对于构建动态网页应用至关重要。同时需要注意,不同的浏览器和浏览器版本...
另外,JavaScript还有一套强大的对象模型,如DOM(文档对象模型),它允许我们以编程方式操纵HTML文档。 DOM2-Style是DOM的一个扩展,专门处理CSS样式。通过DOM,我们可以动态改变元素的样式属性,实现动态效果。...
JavaScript开发文档是一个全面的资源集合,旨在为Web开发者提供关于创建交互式网页所需的各种技术的指导和支持。这个压缩包包含了四个关键部分,分别是"网页制作完全手册.chm"、"JS使用手册.chm"、"样式表.chm"以及...
例如,DOM(Document Object Model)是HTML和XML文档的结构化表示,JavaScript通过DOM可以访问和修改页面上的任何元素。`document.getElementById()`、`document.querySelector()`和`document.querySelectorAll()`等...
这份"JavaScript中文帮助文档"是开发者和学习者的重要参考资料,它涵盖了JavaScript的核心概念、语法、函数以及API的详细解释。 在JavaScript中,基本的数据类型包括字符串、数字、布尔值、null、undefined、对象和...
JavaScript,一种广泛应用于Web开发的脚本语言,是创建交互式网页和动态应用程序的核心工具。在本"JavaScript技术文档"中,我们将会深入探讨这个语言的各个方面,包括它如何推动Web开发进入新纪元,面向对象编程的...
DOM是HTML和XML文档的结构化表示,JavaScript可以通过DOM API来查找、修改、添加或删除HTML元素。例如,可以使用`document.getElementById()`找到特定ID的元素,然后通过改变其`innerHTML`属性来更新元素内容。 ...
7. **DOM操作**:解释如何通过JavaScript来查找、修改和操作HTML元素,如getElementById、querySelector、innerHTML等。 8. **AJAX与Fetch API**:介绍如何进行异步数据请求,理解XMLHttpRequest对象和更现代的...
DOM是HTML和XML文档的结构化表示,JavaScript通过DOM API可以操作网页的元素,如添加、删除、修改元素,或者获取元素属性。例如,`document.getElementById()`用于获取具有特定ID的元素,`element.innerHTML`用于...
Document Object Model(DOM)是HTML和XML文档的结构表示,JavaScript可通过DOM API来操作页面元素,如创建、查找、修改和删除元素。熟悉getElementById、querySelector、innerHTML等方法,能够实现对网页内容的动态...
2. DOM操作:熟悉DOM元素的选择(getElementById、getElementsByClassName、querySelector等)、创建、修改和删除,以及事件委托。 六、ES6及新特性 1. 类与模块:了解ES6引入的类语法,以及模块导入导出(import/...