`
jeelee
  • 浏览: 629174 次
  • 性别: Icon_minigender_1
  • 来自: 深圳
社区版块
存档分类
最新评论

js dom元素查找方法的总结

IE 
阅读更多
js dom元素查找方法的总结
getElementById:这个最司空见惯的根据id定位对象的方式
getElementsByName:依据name(名称)获取一组对象的集合
getElementsByTagName:依据标签名来获得一组对象聚集
getElementsByClassName:实在不存在这个方式
nextSibling:获得下一个元素对象(大概兼容性存在点问题)
previousSibling:获取上一个元素对象(兼容性有点问题)
parentElement:获取当前元素的父对象
children:所有子元素对象的聚集
firstChild:第一个子节点
lastChild:最后一个子节点
parentNode:父节点
childNodes:所有子节点的聚集
这里须要注意的是:parentNode 、childNodes、firstChild、lastChild、nextSibling、previousSibling 这些节点的定位方式,在某些时候IE和FF返回的成果竟是迥然不同的,不得不在此表现对IE的鄙视一下!
分享到:
评论

相关推荐

    JS选取DOM元素的简单方法

    摘自JavaScript权威指南(jQuery根据样式选择器查找元素的终极方式是 先用getElementsByTagName(*)获取所有DOM元素,然后根据样式选择器对所有DOM元素进行筛选) 今天试了下各种选取元素的方法的速度,用原生的方法...

    JavaScript实现获取某个元素相邻兄弟节点的prev与next方法

    本文实例讲述了JavaScript实现获取某个元素相邻兄弟节点的prev与next方法。分享给大家供大家参考,具体如下: /** * 获取相邻元素 * @param ele 参考物元素 * @param type 类型,上一个(1)or下一个(0) * @return ...

    JavaScript DOM节点操作方法总结

    具体的查找方法如下: getElementByID() // 得到单个节点 getElementsByTagName() // 得到节点数组 NodeList getElementsByName() // 得到节点数组 NodeList 同时还可以利用元素节点的属性获取它的父子节点和文本...

    JavaScript HTML DOM元素 节点操作汇总

    在文档对象模型 (DOM) 中,每个节点都是一个对象。DOM 节点有三个重要的属性 : 1. nodeName : 节点的名称 2. nodeValue :节点的值 3. nodeType :节点的类型 节点类型:元素 1 ,属性 2 ,文本 3 ,注释 8,文档 9...

    dom-siblings:查找 DOM 元素的兄弟元素,可以选择由 CSS 选择器过滤

    查找 DOM 元素的兄弟元素,可以选择通过 CSS 选择器进行过滤。 安装 npm install dom-siblings 应用程序接口 兄弟姐妹(元素,选择器) element : 一个 DOM 元素。 selector : CSS 选择器字符串。 var siblings...

    [JavaScript.DOM高级程序设计](加)桑贝斯.扫描版.part1.rar

     12.3.5 构建DOM元素   12.4 添加事件——为人造select赋予生命   12.5 让表单绽放光彩   12.6 行为修正   12.6.1 z-index来救急   12.6.2 键盘控制及其他细节   12.6.3 select太大了吗   ...

    JavaScript基于Dom操作实现查找、修改HTML元素的内容及属性的方法

    本文实例讲述了JavaScript基于Dom操作实现查找、修改HTML元素的内容及属性的方法。分享给大家供大家参考,具体如下: 当网页被加载时,浏览器会创建页面的文档对象模型(Document Object Model)。HTML DOM 模型被...

    原生JS查找元素的方法(推荐)

    今天写了一个很简单、很粗暴的通过JS根据类来查找DOM元素。 为了降低它的粗暴等级(耗费性能)我给了三个等级。 首先性能最好的,适合FF,CH,IE8,通过querySelectorAll这个API。 其次是指定ID 最后只能全页面进行匹配...

    javascript基础之查找元素的详细介绍(访问节点)

    当然这些选择器都是jQuery扩展的一些方法,那么使用原生js时要怎样来查找元素呢?今天就来简单梳理下。DOM定义了多种查找元素的方法,除了我们常用的getElementById(),还有getElementsByTagName()和...

    dom-find:用于查找 DOM 元素的实用程序。 由 react-stickydiv 使用

    查找 DOM 实用程序用于查找 DOM 元素的实用程序。 由 var util = require ( 'dom-find' ) ;// util.findPos(document.getElementById("element"));// [0,100]// util.findPosRelativeToViewport(document....

    JS访问DOM节点方法详解

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

    JS实现访问DOM对象指定节点的方法示例

    主要介绍了JS实现访问DOM对象指定节点的方法,结合实例形式分析了javascript针对DOM元素节点属性相关操作技巧,需要的朋友可以参考下

    JavaScript 获取元素在父节点中的下标(推荐)

    jQuery中直接通过$(this).index()即可得到当前元素的下标。下面通过实例给大家介绍JavaScript 获取元素在父节点中的下标,需要的朋友参考下吧

    ElementsCollector:返回 DOM 元素的 Javascript 选择引擎

    元素收集器 返回 DOM 元素的 Javascript 选择引擎。 按标签名称、id、类或这些的组合查找元素。 如何使用 克隆 repo 并在 chrome 中打开 test.html。 可以在控制台中找到通过测试的详细信息。

    详谈DOM简介及节点、属性、查找节点的方法

    DOM定义了表示和修改文档的方法,不能修改css样式表,在js中使用DOM方法改变元素的css样式,实质上是在元素上添加行间样式。 DOM对象就是宿主对象,用来操作HTML和xml功能对象的集合。 xml——>xhtml——>html4.0...

    jQuery选择器上机练习题及答案.rar

    (答案见下载资源) 上机任务1 ... 在chrome的控制台中输入jQuery...为某dom元素应用某css样式可以使用jQuery中的addClass方法,例如:将id为tt的div元素应用.bt样式,可用些语句:$("#tt").addClass("color","red");

    js中查找最近的共有祖先元素的实现代码

    先来看概念,首先DOM是一棵树,其根节点是Document,大致可以用下图来表示: 所谓“最近的共有祖先元素”,是指给定一系列元素,找出在树中深度最大的,但同时为所有这些元素的祖先元素的元素。 比如上图中,I和G的...

    [JavaScript.DOM高级程序设计](加)桑贝斯.扫描版.part3.rar

     12.3.5 构建DOM元素   12.4 添加事件——为人造select赋予生命   12.5 让表单绽放光彩   12.6 行为修正   12.6.1 z-index来救急   12.6.2 键盘控制及其他细节   12.6.3 select太大了吗   ...

    [JavaScript.DOM高级程序设计](加)桑贝斯.扫描版.part2.rar

     12.3.5 构建DOM元素   12.4 添加事件——为人造select赋予生命   12.5 让表单绽放光彩   12.6 行为修正   12.6.1 z-index来救急   12.6.2 键盘控制及其他细节   12.6.3 select太大了吗   ...

Global site tag (gtag.js) - Google Analytics