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

DOM选择器,即查找标签对象

时间:2018-12-19 00:29:44      阅读:733      评论:0      收藏:0      [点我收藏+]

标签:style   getattr   inner   图片   nod   选择器   code   next   remove   

一、查找元素

1、直接查找

document.getElementById(‘id1‘)         //根据ID返回单个标签
document.getElementsByName(‘n1‘)    //根据name属性获取标签集合
document.getElementsByClassName(‘c1‘)  //根据class属性获取标签集合
document.getElementsByTagName(‘div‘)   //根据标签名获取标签集合

2、间接查找

parentElement           // 父节点标签元素
children                // 所有子标签
firstElementChild       // 第一个子标签元素
lastElementChild        // 最后一个子标签元素
nextElementtSibling     // 下一个兄弟标签元素
previousElementSibling  // 上一个兄弟标签元素

   不常用:查找节点,节点包括:元素,文本,不包括属性

技术分享图片
parentNode          // 父节点
childNodes          // 所有子节点
firstChild          // 第一个子节点
lastChild           // 最后一个子节点
nextSibling         // 下一个兄弟节点
previousSibling     // 上一个兄弟节点
查节点

二、操作标签

1、内容

innerText   //文本 
value       //

 

2、属性

attributes                // 获取所有标签属性
setAttribute(key,value)   // 设置标签属性
getAttribute(key)         // 获取指定标签属性

 

3、class

className                // 获取所有类名
classList.remove(cls)    // 删除指定类
classList.add(cls)       // 添加类

 

DOM选择器,即查找标签对象

标签:style   getattr   inner   图片   nod   选择器   code   next   remove   

原文地址:https://www.cnblogs.com/staff/p/10140834.html

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