`

访问html Dom节点的方法

阅读更多

一、直接获取

1、document.getElementById()

2、document.getElementsByTagName()

3、document.getElementById('ID').getElementsByTagName("标签名称");

 

实例:

var x=document.getElementsByTagName("p");
for (var i=0;i<x.length;i++)
  {
  // do something with each paragraph
  }

 

要访问第三个 <p> 元素,您可以这么写
var y=x[2];

 

 

二、通过某个已知节点获取

var x=document.getElementById("id");

//获取节点

var y = x.firstChild;

//或者

var y = x.lastChild;

//或者

var y = x.parentNode;

 

//获得节点元素的文本
var text=x.firstChild.nodeValue;

 

//删除节点
x.parentNode.removeChild(x);

 

三、获取根节点

//返回存在于 XML 以及 HTML 文档中的文档根节点

document.documentElement

 

//对 <body> 标签的直接访问

document.body

分享到:
评论

相关推荐

    HTML DOM基础教程(网页形式)

    DOM 节点访问 DOM 节点信息 DOM How To DOM 参考 DOM 总结 DOM 实例 DOM 实例 DOM 对象 DOM Window DOM Navigator DOM Screen DOM History DOM Location DOM Document DOM Anchor DOM Area DOM Base ...

    JS访问DOM节点方法详解

    本文实例讲述了JS访问DOM节点方法。分享给大家供大家参考,具体如下: 查找并访问节点 你可通过若干种方法来查找您希望操作的元素: 通过使用 getElementById() 和 getElementsByTagName() 方法 通过使用一个元素...

    JQuery插入DOM节点的方法

    本文实例讲述了JQuery插入DOM节点的方法。分享给大家供大家参考。具体分析如下: 动态创建HTML元素并没有实际用处,还需要将新创建的元素插入文档中。将新创建的节点插入文档最简单的办法是,让它成为这个文档的某个...

    JQuery创建DOM节点的方法

    本文实例讲述了JQuery创建DOM节点的方法。分享给大家供大家参考。具体分析如下: 用JQuery选择器能够快捷而轻松地查找到文档中的某个特定的元素节点,然后可以用attr()方法来获取元素的各种属性的值。但真正的DOM...

    JQuery查找DOM节点的方法

    本文实例讲述了JQuery查找DOM节点的方法。分享给大家供大家参考。具体分析如下: DOM操作是JQuery最常见的用法,下面我们来将JQuery的DOM操作逐个剖析下。先来最简单的查找节点操作。 为了能全面地讲解DOM操作,首先...

    HTML DOM简介.rar

    3. 访问DOM节点1——getElementById() 4. 访问DOM节点2——getElementsByTagName() 5. 访问DOM节点3——通过节点关系 6. DOM节点信息 7. DOM信息nodeType的应用 8. 修改DOM——innerHTML 9. 删除DOM节点——...

    dom-to-svg:用于将给定HTML DOM节点转换为可访问的SVG“屏幕截图”的库

    用于将给定HTML DOM节点转换为可访问的SVG“屏幕截图”的库。 演示版 :camera_with_flash: 试用,该使用此库可让您获取任何网页的SVG屏幕截图。 您可以在找到源代码。 用法 import { documentToSVG , elementToSVG...

    JAVASCRIPT操作DOM建立增加删除克隆访问节点示例宣贯.pdf

    JavaScript 操作 DOM 建立增加删除克隆访问节点示例宣贯 在 JavaScript 中,DOM(Document Object Model)是指文档对象模型,它是 HTML 和 XML 文档的编程接口。通过 DOM,我们可以动态地操作文档的结构、样式和...

    DOM下的节点属性和操作小结

    属性: 1 .nodeName 节点名称,相当于tagName.属性节点返回属性名,文本节点返回#text。nodeName,是只读的。 2 .nodeType 值:1,元素节点;2,属性节点;3,文本节点。nodeType是只读的。 3 .nodeValue 返回一个...

    JQuery替换DOM节点的方法

    本文实例讲述了JQuery替换DOM节点的方法。分享给大家供大家参考。具体分析如下: 如果要替换某个节点,jQuery提供了相应的方法,即replaceWith()和replaceAll()。 replaceWith()方法的作用是将所有匹配的元素都替换...

    练习2:访问当当购物车页面节点

    北大青鸟,accp8.0,练习2:访问当当购物车页面节点。..

    DOM — DOM对象继承关系1

    在 DOM 中,每个节点都有其父节点和子节点,可以使用 parentNode、childNodes、previousSibling、firstChild、lastChild 和 nextSibling 等属性来访问和操作节点之间的关系。 除此之外,DOM 中还提供了一些常用的...

    jacascript DOM节点——元素节点、属性节点、文本节点

     元素节点就是HTML标签元素,元素节点主要提供了对元素标签名、子节点及属性的访问;  元素节点的三个node属性:nodeType:1、nodeName/TagName:元素的标签名大写、nodeValue:null;  其父节点 parentNode 指向...

    HTML_DOM_教程

    HTML DOM 教程 • Next Page HTML DOM 定义了访问和操作HTML文档的标准方法。 HTML DOM 把HTML文档呈现为带有元素、属性和文本的树结构(节点树)。 开始学习HTML DOM!

    计算机应用技术第6章-DOM编程.pptx

    它提供了访问和操作DOM树的方法,包括getElement系列方法、setAttribute系列方法、removeChild系列方法等。通过使用Core DOM,可以动态地改变文档的内容。 五、任务实现 任务1:画出页面的文档节点结构图 任务...

    PHP DOM扩展库:SimpleXML 解析XML文档.md

    DOM 将文档(如 HTML 或 XML)解析为一个由节点(如元素节点、属性节点、文本节点等)和对象组成的结构集合,这些节点和对象可以通过一系列属性和方法进行访问和修改。 1. **结构**:DOM 将文档解析为一个树形结构...

    采集基本概念Web信息检索与数据抓取网页DOM结构3优秀文档.pptx

    此外,DOM 还提供了很多有用的方法,如 `createTextNode`、`createComment`、`createDocumentFragment` 等,可以用来创建新的节点或文档片段。 DOM 结构是 Web 信息检索和数据抓取的基础,理解 DOM 结构对于数据...

    JavaScript中对DOM节点的访问、创建、修改、删除

    用DOM方法和属性,你可以访问,修改,删除页面上任意一个元素,也是可以添加一个元素。DOM是独立于语言的API,可以被任意语言所实现,当然也包括了Javascript 看看下面的一个文本。 &lt;!DOCTYPE html PUBLIC -//W3...

    DOM初体验,认识DOM

    文档对象模型——Document Object Model DOM可以视为一种API的应用 将文件视为一个文件对象,...HTML DOM 定义了访问和操作HTML文档的标准方法。 HTML DOM 把 HTML 文档呈现为带有元素、属性和文本的树结构(节点树)。

    HTML DOM Document 对象

    HTML DOM 节点 在 HTML DOM (Document Object Model) 中 , 每一个元素都是 节点: 文档是一个文档节点。 所有的HTML元素都是元素节点。 所有 HTML 属性都是属性节点。 文本插入到 HTML 元素是文本节点。are text ...

Global site tag (gtag.js) - Google Analytics