码迷,mamicode.com
首页 > 其他好文 > 详细

(一)DOM 常用操作之“查找”

时间:2017-12-12 00:09:13      阅读:122      评论:0      收藏:0      [点我收藏+]

标签:blog   名称   var   tle   sele   element   pos   元素   http   

在DOM树中,如果想要操作一个(些)节点对象,首先我们要“查找”到这个(些)节点对象。这些方法用于在文档中获取所需的HTML元素。你必须熟记这些方法(各大浏览器目前的支持情况):

一、通过指定的ID属性获取节点对象

var e = document.getElementsById(id);

如果一个页面的ID属性不是唯一的,则返回第一个ID对应的节点对象。

在操作文档的一个特定的元素时,最好给该元素一个 id 属性,为它指定一个(在文档中)唯一的名称,然后就可以用该 ID 查找想要的元素。

 

二、通过指定的name属性获取节点对象集合

var el = document.getElementsByName(name);

该方法与 getElementById() 方法相似,但是它查询元素的 name 属性,而不是 id 属性。

另外,因为一个文档中的 name 属性可能不唯一(如 HTML 表单中的单选按钮通常具有相同的 name 属性),所有 getElementsByName() 方法返回的是元素的数组,而不是一个元素。

 

三、通过指定的“标签名”获取节点对象集合

var el = document/element.getElementsByTagName(tagName);

如果把特殊字符串 "*" 传递给该方法,它将返回文档中所有元素的列表,元素排列的顺序就是它们在文档中的顺序。

 

四、通过指定的“类名”获取节点对象集合

var el = document/element.getElementsByClassName(class1[ class2]);

多个类名使用空格分隔,如 "test demo"。

   

五、通过匹配CSS 选择器获取节点对象 

var e = document/element.querySelector(CSS Selector);

匹配指定 CSS 选择器的第一个元素。 如果没有找到,返回 null。如果指定了非法选择器则 抛出 SYNTAX_ERR 异常。 

 

六、通过匹配CSS 选择器获取节点对象集合 

var el = document/element.querySelectorAll(CSS Selector); 

返回文档中匹配的CSS选择器的所有元素节点列表。

(一)DOM 常用操作之“查找”

标签:blog   名称   var   tle   sele   element   pos   元素   http   

原文地址:http://www.cnblogs.com/flyingweb/p/8022472.html

(0)
(0)
   
举报
评论 一句话评论(0
登录后才能评论!
© 2014 mamicode.com 版权所有  联系我们:gaon5@hotmail.com
迷上了代码!