`
wnzz95391511
  • 浏览: 126510 次
  • 性别: Icon_minigender_1
  • 来自: 北京
社区版块
存档分类
最新评论

JS基础学习二:DOM

阅读更多
获取节点:
document.getElementById("nodeId");
document.getElementsByTagName("nodeTagName");


树形操作:
firstChild
lastChild
childNodes
parentNode
nextSibling //同级的下一节点
previousSibling //同级的上一节点


创建节点
document.createElement("TagName");


创建文本节点
var newTextNode = document.createTextNode("ItemX")
;

移除节点
removeChild(list.lastChild); //移除子节点
curNode.parentNode.removeChild(curNode); //通过父节点移除本节点
this.parentNode.remove(this);


替换元素
list.replaceChild(newNode,list.firstChild);


节点的属性:
newLink.setAttribute("href","xxx.html");


克隆元素
var newItem= oldItem.cloneNode(true);
//true: 克隆子节点
//false:只克隆本节点


节点的操作
nodeName //节点的本来签名
nodeValue //节点的值
className //节点的Class属性值
innerHTML //节点内HTML文本
1
1
分享到:
评论

相关推荐

    头歌教学实践平台 Web前端开发基础 JavaScript学习手册十四:HTML DOM-文档元素的操作(二)

    这篇教程——"JavaScript学习手册十四:HTML DOM-文档元素的操作(二)"深入探讨了如何使用JavaScript来操纵HTML文档中的元素,进一步提升网页动态性和交互性。 DOM是HTML和XML文档的一种结构化表示,它将网页内容...

    js学习资源(js基础、BOM和DOM操作)

    JavaScript,简称JS,是Web开发中的重要脚本语言,用于实现...学习JavaScript基础及BOM和DOM操作是成为一名合格前端开发者的必经之路。通过练习和项目实战,能更深入理解和运用这些知识点,不断提升自己的技能水平。

    js_HTML_Dom操作练习

    在JavaScript的世界里,HTML DOM(Document Object Model)是网页内容的一种结构化表示,它允许我们通过编程...随着对DOM操作的熟练掌握,开发者能够更好地理解前端开发的核心原理,为后续的Web应用开发打下坚实基础。

    JavaScript DOM编程艺术【第2版&高清】.pdf

    1. JavaScript基础知识:JavaScript是一种在浏览器中运行的脚本语言,它是实现网页动态效果和交云的核心技术之一。要精通DOM编程,首先要对JavaScript语言本身有足够的理解,包括变量、数据类型、运算符、函数、对象...

    html.rar_dom基础学习

    DOM基础学习主要包括以下几个方面: 1. **DOM结构**:DOM将HTML文档解析为一棵由节点组成的树,其中每个元素、属性和文本都对应一个节点。根节点是`<html>`,下面包含`<head>`和`<body>`两个子节点。元素节点有子...

    JavaScript dom编程艺术:个人笔记.pdf

    1. JavaScript基础知识:学习DOM编程之前,首先要掌握JavaScript的基础语法,包括变量声明、数据类型、控制结构(如if语句和循环)、函数定义与调用等。理解这些基础知识对于后面深入学习DOM操作至关重要。 2. DOM...

    DOM.zip_JavaScript dom_it

    JavaScript DOM(Document Object Model)是Web开发中的一个关键概念,它是一种标准,允许程序员通过JavaScript或其他脚本语言来访问...通过“DOM.chm”这份资源,你可以深入学习DOM的各个方面,提高你的前端开发技能。

    JavaScript.DOM编程艺术(第2版)附录及源码.rar

    1. **JavaScript基础**:书中会涵盖JavaScript的基本语法,包括变量、数据类型、控制结构、函数、对象等。这些是进行DOM编程的基础,读者需要熟练掌握。 2. **DOM理解**:DOM是HTML和XML文档的抽象表示,通过DOM,...

    JavaScriptDOM编程艺术第二版

    JavaScript DOM编程艺术第二版是一本深入探讨JavaScript与DOM(Document Object Model)交互的权威书籍,主要面向希望提升JavaScript技能并掌握网页动态效果开发的Web开发者。DOM是HTML和XML文档的编程接口,它允许...

    JavaScriptDOM编程艺术

    1. **JavaScript基础**:在深入DOM之前,首先需要理解JavaScript的基础语法,包括变量、数据类型、控制流程、函数等。这些基础知识是编写任何JavaScript代码的基础,也是理解DOM操作的前提。 2. **DOM概念**:DOM是...

    javascript dom编程艺术 第2版 源码

    1. **JavaScript基础**:在学习DOM编程之前,首先要掌握JavaScript的基础知识,包括变量、数据类型、控制结构(如条件语句和循环)、函数以及对象。这些是构建DOM操作脚本的基础。 2. **DOM概念**:DOM是文档对象...

    DOM Scripting.Web.Design.with.JavaScript.and.the.Document.Object.Model(JavaScript DOM编程艺术)

    1. **DOM基础**:理解DOM的基本概念,如节点类型(元素节点、属性节点、文本节点等)、DOM树结构,以及如何通过JavaScript访问和操作这些节点。 2. **遍历DOM**:学习如何遍历DOM树,查找特定的元素,如使用`...

    头歌教学实践平台 Web前端开发基础 JavaScript学习手册一:JS简介

    通过"头歌教学实践平台"的JavaScript学习手册一:JS简介,初学者将能全面理解JavaScript的基础概念,并能够开始编写简单的交互式网页。随着学习的深入,可以进一步探索更高级的技术,如React、Vue等前端框架,以及...

    经典之作javascript dom编程艺术源码

    通过学习并实践《JavaScript DOM编程艺术》中的源码,开发者能够掌握原生JavaScript对DOM的精细控制,从而提升网页交互的灵活性和性能。同时,理解并熟练运用这些知识点,对于开发高效、响应式的Web应用至关重要。在...

    JavaScript高级程序设计 学习笔记之DOM基础(五)

    这篇学习笔记主要围绕DOM基础展开,涵盖了JavaScript操作DOM的各种方法和技术。 在JavaScript中,DOM被视为一个树形结构,其中每个节点代表了页面上的一个元素、属性或文本。DOM的基础主要包括以下几个方面: 1. *...

    javascriptDom编程艺术+源码

    1. JavaScript基础:包括语法、变量、数据类型、函数等。 2. DOM基础:解释了DOM的概念,如何选择、遍历、创建和修改DOM元素。 3. 事件处理:学习如何绑定和处理页面上的用户交互事件。 4. 实践应用:通过源码实例...

    头歌教学实践平台 Web前端开发基础 JavaScript学习手册十三:HTML DOM-文档元素的操作(一)

    JavaScript通过DOM API可以直接访问和修改这个结构,从而改变页面内容、样式或者行为。 在本手册中,首先会介绍如何获取DOM元素。常见的方法有`document.getElementById`,通过元素的ID来获取;`document....

    DOM基础及DOM操作HTML

    通过学习DOM基础和DOM操作HTML,你可以更好地控制网页内容,实现动态效果,提升网页的交互性和用户体验。王兴魁老师的课程将帮助你掌握这些技能,并结合AJAX实践,进一步提升你的前端开发能力。

Global site tag (gtag.js) - Google Analytics