JS标签选择器以及节点操作

JS的DOM开始当然是从选择器开始的，小编这边先做一个归类。

一、DOM选择器

document代表整个文档这边就省略他的开头了

1. getElementById( ) //显然是用作与获取id来获取标签（实战中不常用）

2.getElementByTagName( ) //通过标签类型来获取节点（常用）

3.getElementByClassName( ) //类名获取

4.querySelector( ) //内部放的是可以跟css选择器一样的格式但选取的是静态的（选取的那一刻之后更改了源头这个还是不会变）

二、节点操作

网页之中不可能所有的标签都是用选择器选出来的嘛那么小编这边在介绍一下节点操作，节点分为元素节点和节点，节点包含文本之类的这边也不做介绍，感兴趣可以去看一下。

元素节点：

1.parentElement( ) //返回引用对象父节点

2.children( ) // 返回子元素节点集

3.firstElementChild / lastElementChild //返回第一 \ 最后子元素节点

4.nextElementSibling / previousElementSibling //返回上一个 / 下一个兄弟元素节点

上述都是基于对象选择下面是一些基于文档的增查删改：

1.creatElement( ) //创建元素节点

2.appendChild( ) //插入元素节点，插入顺序跟数组方法push一样，如果是操作页面中本身有的属性则相当于剪切

insertBefore(a,b) // 把a节点元素插到b前面

3.parent.removeChild() //通过父级选取元素节点删除

child.remove( ) //删除自身

4.parent.replaceChild(new , orgin) //通过父级选择替换

节点的一些属性：

1.nodeName //节点名称

2.nodeVaule //文本节点内容可读写

3.nodeType //文本属性值（这边罗列几个常见的）

可以用作判断。

4. innerHTML //往对象标签中添加内容，注意都是基于html文件的所以说在里面写的内容相当于直接加到html文档之中所以也可以去写一些标签进去可以实现效果。

5. setAttribute(属性名,属性值) // 我们通过这样的方法可以给标签加属性，可以是自建属性。

getAttribute(属性名) //获取属性值

JS标签选择器以及节点操作相关推荐

13前端学习之WebAPI(三):节点操作、事件高级、DOM事件流、事件委托冒泡
文章目录一.节点操作: 1. 删除节点: 1.2. 案例:删除留言 2. 赋值(克隆)节点: 3. 案例:动态生成表格: 3.1 案例分析: 3.2 实现: 4. 创建元素的三种方式: 4.1 区别 ...
04-老马jQuery教程-DOM节点操作及位置和大小
1. jQuery创建DOM标签 1.1 DOM动态创建标签的方法 DOM时代我们通过document的createElement方法动态创建标签.创建标签后,动态的给他添加属性.例如代码: // 动 ...
java与jquery的选择器区别_java day44【JQuery 基础：概念，快速入门，JQuery对象和JS对象区别与转换，选择器，DOM操作，案例】...
第一章JQuery 基础 1. 概念: 一个JavaScript框架.简化JS开发 * jQuery是一个快速.简洁的JavaScript框架,是继Prototype之后又一个优秀的JavaScrip ...
java day44【JQuery 基础：概念，快速入门，JQuery对象和JS对象区别与转换，选择器，DOM操作，案例】...
第一章 JQuery 基础 1. 概念: 一个JavaScript框架.简化JS开发 * jQuery是一个快速.简洁的JavaScript框架,是继Prototype之后又一个优秀的JavaScr ...
web前端(5)：了解jQuery(常见选择器+相关尺寸+元素/节点操作)
文章目录一.jQuery是什么二.JQuery的常见选择器三.JQuery的元素操作四.相关尺寸函数五.常用的事件方法 1. 绑定事件的两种方式 2.解除绑定六.节点操作七.经典案例 1 ...
JS节点操作、节点层级获取
目录获取元素方法节点层级获取元素节点概述父子层级兄弟层级节点操作创建节点添加节点删除结点复制节点获取元素方法 DOM提供的方法获取元素,利用标签特性获取元素,如标签名.类名等. ...
js节点操作自定义属性
JS自定义属性和节点操作 1.节点是什么? 所谓的节点操作指的是:网页中的所有内容都是节点(标签.属性.文本.注释等),在DOM 中,节点使用 node 来表示.所有 HTML 元素(节点)均可被修改 ...
js day04DOM节点操作、事件对象与BOM
DOM节点操作.事件对象与BOM V1.2 一.复习提问  js中目前学到的事件由哪些  如何阻止a链接  设置表单例如disabled selected checked的正确方式是什么?  ...
js原生后代选择器_JavaScript DOM查询，原生js实现元素子节点的获取
每个网页都是一个dom树,网页中所有的内容都是这个树上的一个节点.JavaScript的工作就是操作这些节点,对节点进行查增删改操作,或是给节点绑定事件. 网页 dom树要操作dom节点,首先要获取 ...

JS标签选择器以及节点操作

JS标签选择器以及节点操作相关推荐

最新文章

热门文章