html之DOM属性查找,操作
2017-09-26 15:22
447 查看
<div id='div0' class='div1' name='div2'></div>
DOM属性查找
定位查找
var oDiv = document.getElementById(‘div0’)var oDiv = document.getElementsByClassName(‘div1’)
var oDiv = document.getElementsByTagName(‘div’)
var oDiv = document.getElementByName(‘div2’)
导航查找
parentElement 查找父级标签
nextElementSibling 查找下一个同级标签
previousElementSibling 查找上一个同级标签
children 查找所有的子标签
firstElementChild 查找第一个子标签
lastElementChild 查找最后一个字标签
操作
文本操作
.innerText 操作纯文本,所以不是很常用.innerHTML操作纯文本和标签文本
属性操作
<div id='div0' class='div1' name='div2'></div>
var oDiv = document.getElementById('div0')
赋值操作
oDiv.id = ‘div10’onDiv.id.setAttribute(‘id’,’div10’)
查找操作
console.log(oDiv.id)console.log(oDiv.getAttribute(‘id’))
对class属性的处理!!!
className获取当前标签所有class属性的名字,类型string,所有的属性名为一个大的字符串。
classList.add()对class属性名进行添加,classList类型为object。
classList.remove()对class属性名进行移除
相关文章推荐
- 11.21课堂笔记-查找节点和创建节点、插入节点和删除节点、复制节点替换节点、包裹节点和属性操作、样式操作、设置和获取HTML、文本和值
- JqueryDOM操作-jquery查找属性节点
- JavaScript基于Dom操作实现查找、修改HTML元素的内容及属性的方法
- 【DOM操作】实时监听input[type='text']和HTML标签中属性改变事件
- jQuery学习笔记:DOM操作(二)——属性、类、HTML、CSS
- dom-标签查找、属性文本操作、class\style操作、事件、标签增删改查
- Html 内嵌 选择器属性 Dom操作 JavaScript 事件
- DOM方法操作HTML属性
- JavaScript基础----20Javascript-DOM操作HTML
- 【DOM操作】DOM操作HTML中的Select标签
- DOM操作HTML实现AJAX的及时性
- html dom与javascript的关系 -我们用JavaScript对网页(HTML)进行的所有操作都是通过DOM进行的
- HTML DOM position 属性
- jquery操作HTML属性和控件
- HTML DOM classList属性
- javasript 的DOM 节点操作:创建,插入,删除,复制以及查找节点
- js之DOM操作中获取属性方法
- 用正则查找html中有id属性的html标签
- 16、使用jQuery操作DOM之操作HTML、文本和值
- htmlDOM操作1