js怎样获取元素节点怎样获取某个元素下的第一个节点获取相邻的兄弟节点

╰半夏微凉° 2023-06-06 12:11 15阅读 0赞

## 有时候不需要使用jquery，而如果需要用原生js获取节点就比较麻烦了 ##

## 以下是一些比较常用的api，记录一下。 ##

## 不一定兼容ie ##

<!DOCTYPE html>
    <html lang="zh">
    	<head>
    		<meta charset="UTF-8">
    		<meta name="viewport" content="width=device-width, initial-scale=1.0">
    		<meta http-equiv="X-UA-Compatible" content="ie=edge">
    		<title></title>
    	</head>
    	<body>
    		<div id="box">
    			<p>first</p>
    			<p>two</p>
    			<p>three</p>
    			<p>four</p>
    			<p>last</p>
    		</div>
    	</body>
    </html>
    <script type="text/javascript">
    	// 通过id获取节点
    	var dom0 = document.getElementById('box');
    	console.log(dom0);
    	// 也可以用querySelector
    	let dom = document.querySelector('#box');
    	console.log(dom);
    	// 获取到子节点
    	console.log('children', dom.children);
    	// firstChild会获取到换行(如果有)
    	console.log('firstChild', dom.firstChild);
    	// firstElementChild会去掉换行
    	console.log('firstElementChild', dom.firstElementChild);
    	console.log('children下标获取', dom.children[0].innerHTML);
    
    	// 获取紧挨着的同级元素
    	console.log('nextSibling', dom.children[0].nextSibling);
    	// nextElementSibling
    	console.log('nextElementSibling', dom.children[0].nextElementSibling);
    	
    </script>

发表评论取消回复

表情：

评论列表（有 0 条评论，15人围观）

还没有评论，来说两句吧...

相关阅读

相关 jQuery获取当前元素的其他元素节点

$(".div1").click(function () { let span1 = $(this).find(".span1-1"); //

港控/mmm°/ 2023年06月08日 04:44/ 0 赞/ 56 阅读

相关 js怎样获取元素节点怎样获取某个元素下的第一个节点获取相邻的兄弟节点

有时候不需要使用jquery，而如果需要用原生js获取节点就比较麻烦了以下是一些比较常用的api，记录一下。不一定兼容ie <!DOCTYPE h

╰半夏微凉°/ 2023年06月06日 12:11/ 0 赞/ 16 阅读

相关 vue获取节点的父节点、兄弟节点、子节点

<span @click="getClickInfo(event)"> </span> getClickInfo: function (e)

红太狼/ 2023年06月06日 12:04/ 0 赞/ 76 阅读

相关 jquery 获取当前元素的前一个兄弟节点元素

jquery 获取当前元素的前一个兄弟节点元素，可以使用 prev() 方法示例代码 <!DOCTYPE html> <html> <h

墨蓝/ 2022年12月29日 06:29/ 0 赞/ 341 阅读

相关 JS获取节点的兄弟，父级，子级元素

先说一下JS的获取方法，其要比JQUERY的方法麻烦很多，后面以JQUERY的方法作对比。 JS的方法会比JQUERY麻烦很多，主要则是因为FF浏览器，FF浏览器会把你的换行

秒速五厘米/ 2022年07月14日 09:55/ 0 赞/ 391 阅读

相关 js jquery 获取元素(父节点,子节点,兄弟节点),元素筛选

一,js 获取元素(父节点,子节点,兄弟节点) var test = document.getElementById("test"); 　　var paren

た入场券/ 2022年06月17日 04:48/ 0 赞/ 499 阅读

相关 js、jquery 获取父节点、子节点、兄弟节点

一 js 获取父节点,子节点,兄弟节点 var test = document.getElementById("test"); var parent =

缺乏、安全感/ 2022年03月19日 14:34/ 0 赞/ 495 阅读

相关【JavaScript & jQuery】获取元素各个节点 (父节点,子节点,兄弟节点),元素筛选

![在这里插入图片描述][20190428142233854.png] JavaScript原生版： var test = document.getElementB

- 日理万妓/ 2022年02月20日 03:41/ 0 赞/ 400 阅读

相关获取节点及元素的代码

<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>title</ti

我不是女神ヾ/ 2021年12月16日 19:29/ 0 赞/ 281 阅读

相关 vue怎样操作元素怎样获取元素节点

vue中建议我们操作节点的时候使用ref来获取节点，所以虽然可以用document.getElement之类的语句来操作，不过代码还是有点长，所以我们可以使用vue提供的ap

淩亂°似流年/ 2021年12月09日 18:13/ 0 赞/ 650 阅读