原生获取节点（父子兄弟）

最新推荐文章于 2023-03-27 21:42:30 发布
最新推荐文章于 2023-03-27 21:42:30 发布
阅读量1k 收藏
点赞数
文章标签： 原生js
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.csdn.net/dokill/article/details/76167527
版权 
var s = document.querySelector("#box"),

    chils = s.childNodes, //得到s的全部子节点 
    par = s.parentNode, //得到s的父节点 
    ns = s.nextSibling, //获得s的下一个兄弟节点 
    ps = s.previousSibling, //得到s的上一个兄弟节点 
    fc = s.firstChild, //获得s的第一个子节点 
    lc = s.lastChild, //获得s的最后一个子节点
dokill
关注
原生JS--解读Node（节点）
descire
01-18 5106
写在前面本来开开心心的看着ityped.js的源码，才看到几十行就发现怎么有两个方法没见过。然后翻看了一下MDN,发现自己的知识库要更新了。通过翻阅MDN和Stack Overflow，总结一些原生DOM操作的知识点，大致分为三个部分：Node解读、Element上的操作、DOM中的位置计算。Node的分类Node中有很多类，但是有几个你必须记住： | 类型 | node
节点操作（利用父子兄弟关系获取元素）
m0_51281306的博客
03-06 790
节点操作 利用DOM提供的方法获取元素 （逻辑性不强，繁琐） document.getElementById() document.getElementByTagName() document.querySelector 等等 利用 （简单、符合逻辑） 利用父子兄的节点关系获取元素 逻辑性强，但是兼容性差 节点 页面中所有的内容（标签、属性、文本、注释等）都是节点。节点用node表示。 HTML DOM树中的所有节点均可通过JavaScript 进行访问，所有HTML节点均可被修改，
原生获取DOM节点
03-27 1665
原生获取DOM节点
原生js获取元素及操作节点的方法
丽丽大神ing的博客
08-20 420
参考1 参考2
原生操作节点
yeee1128的博客
08-18 1798
1.获取子节点 1.1 父节点.children 1.2 父节点.childNodes 标准属性 var oUl = document.getElementsByTagName("ul")[0]; //获取子节点 //1.1 父节点.children 非标准属性 一般用这个 var children = oUl.children; console.log(children); //HTMLCollection(6)
原生JavaScript节点
林毅洋
05-11 534
父节点 .parentNode 当前节点第一个.parentNode.firstChild 上一个节点.previousSibling 当前节点 下一个节点.nextSibling 当前节点最后.parentNode.lastChild 子节点.childNodes[0] <a href="?act=del&page=1&ID=1">删除
关于父子节点、父子元素、祖辈元素的获取
WhaleFallljf的博客
11-01 1836
关于父子节点、父子元素、祖辈元素的获取 我们可以通过下面这种js的写法来分析怎么来获取元素的 获取当前元素的父元素的父元素的第二个子元素中的第一个子元素中的第一个子元素 1、JS写法解释 是不是感觉这句话很绕，但是这句话的逻辑就是这样的，因为hildern指的是返回当前元素的所有元素节点，所以你需要选中那个的话你只需要去获取这个元素的下标就可以直接获取你需要元素的位置了 2、Jq写法解释 Jquery的写法就真的是简单粗暴，就直接获取你某个父元素，获取完了你的这个父元素之后，就直接通过一个find方法就直接
DOM—操作元素（H5自定义属性） 节点操作（子、父、兄弟节点， 创建、添加节点， 删除节点，复制节点）
m0_59030524的博客
02-21 2497
1. H5自定义属性 目的：用于保存并使用数据。有些数据可以保存到页面中而不用保存到数据库中。 由于有些自定义属性很容易引起歧义，难以判断是元素内置属性还是自定义属性。 H5给我们新增了自定义属性： 1.1 设置H5自定义属性 H5规定自定义属性 date-开头作为属性名并且赋值 如: <div date-index = "1" ></div> ...
jQuery之操作节点/获取元素位置
weixin_44395929的博客
03-03 671
//今天回顾一下jQuery如何操作节点和获取元素位置。 jQuery 的节点操作 创建节点 => 对应原生 js 里面的 createElement() 用法： $(“html 格式的文本”) => $("<div>aha</div>") 插入节点 => 对应...
温故知新——DOM操作之获取节点
Raaabbt GO!!
08-17 301
浏览器读取 HTML 文件并进行解析之后，会生成一棵由 DOM 节点构成的树，我们可以对其中的节点进行操作 基本的 DOM 节点操作包括节点的获取、创建、修改、插入和删除 我们先写一段简单的 HTML 代码， <body> <header id="title" class="main-title"> <span class="text-heading"&g...
原生javascript取子节点
vagg13的博客
12-25 653
1.javascript使用的方法是children,它取出的是元素节点，只包含元素，不包含其他节点（节点的认识可参考http://www.cnblogs.com/Jersen/p/4908943.html，此为转载）使用方法可参考我的代码如下： 1111 2111 3111 4111 var k=document.getElementById("sa").children; consol
原生js节点操作
Niko_Yu的博客
12-04 628
原生js节点操作节点属性值1 获取上级节点 1Node.parentNode //返回父节点2Node.ownerDocument //返回祖先节点 2 获取下级节点 1Node.childNodes //返回相邻后代的元素节点和文本节点对象的集合(换行算作文本节点)2Node.children //返回相邻后代的元素节点集合3Node.firstChild ...
dom对原生节点、操作篇
weixin_51035283的博客
06-21 401
在原生中，对dom节点的操作，例如 创建，添加，替换，克隆，删除节点等..... 1.创建节点document.createElement('标签名') var odiv=document.createElement('div') console.log(odiv) odiv.innerHTML='这是一个新建的div' ...
js基础之DOM中元素对象的属性方法
weixin_30724853的博客
11-24 148
js基础之DOM中元素对象的属性方法 在 HTML DOM （文档对象模型）中，每个部分都是节点。 节点是DOM结构中最基本的组成单元，每一个HTML标签都是DOM结构的节点。 　　文档是一个 文档节点 。 　　所有的HTML元素都是 元素节点 　　所有 HTML 属性都是 属性节点 　　文本插入到 HTML 元素是 文本节点 　　注释是...
原生 JS 获取节点方法总结
清平调、其N 的博客
01-26 7510
一、js获取子节点的方式 1. 通过获取dom方式直接获取子节点 其中test的父标签id的值，div为标签的名字。getElementsByTagName是一个方法。返回的是一个数组。在访问的时候要按数组的形式访问。 1 var a = document.getElementById("test").getElementsByTagName("div"); ...
js原生获取某个div下的所有子节点
小橙的博客
12-21 7233
var parentNode = document.getElementById('wrapper'); var inputArray = parentNode.getElementsByTagName('input');
JS获取子节点、父节点和兄弟节点的若干种方式
热门推荐
laok_的博客
07-22 27万+
一、js获取子节点的方式1.通过获取dom方式直接获取子节点其中test的父标签id的值，div为标签的名字。getElementsByTagName是一个方法。返回的是一个数组。在访问的时候要按数组的形式访问。var a = document.getElementById("test").getElementsByTagName("div"); 2.通过childNodes获取子节点使用child
原生JS对DOM节点的获取和增删改
dengbi1163的博客
09-03 1043
一、原生JS获取DOM节点 获取节点的方式大致分querySelector系列和getElementsBy 系列，两种：querySelectorAll 属于 W3C 中的 Selectors API 规范 [1]。而 getElementsBy 系列则属于 W3C 的 DOM 规范 [2]。 querySelector 系列接收的参数是一个 CSS 选择符。而 getElement...
总结获取原生JS(javascript)的父节点、子节点、兄弟节点
Code鱼
04-25 7万+
关于原生JS获取节点，一直是个头疼的问题，而且调用方法的名字又贼长了，所以我选择用JQ，好像跑题了-- 话不多说看代码 获取父节点 及 父节点下所有子节点（兄弟节点） &lt;ul&gt; &lt;li&gt; &lt;textarea&gt;文本一&lt;/textarea&gt; &lt;input type=button value="复...
js 原生获取节点样式
最新发布
09-01
在 JavaScript 中，可以使用 getComputedStyle() 方法来获取节点的样式。该方法接受一个参数，即要获取样式的节点。 使用方法如下： ```javascript var element = document.getElementById('myElement'); // 获取...
评论
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

当前余额3.43元 前往充值 >
需支付：10.00元
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明：

1.余额是钱包充值的虚拟货币，按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载，可以购买VIP、付费专栏及课程。

余额充值