JavaScript封装函数:获取下一个/上一个兄弟元素节点
要求:
- 获得下一个/上一个兄弟元素节点,不包括文本节点等
- 解决IE兼容性问题
代码实现:
获得下一个兄弟元素节点:
function getNextElement(element) {
var el = element;
while (el = el.nextSibling) {
if (el.nodeType === 1) {
return el;
}
}
return null;
}
获得上一个兄弟元素节点:
function getPrevElement(element) {
var el = element;
while (el = el.previousSibling) {
if (el.nodeType === 1) {
return el;
}
}
return null;
}
实现效果:
有如下两兄弟标签:
<div>div</div>
<span>span</span>
获得下一个兄弟元素节点:
输入:
var div = document.querySelector('div');
console.log(getNextElement(div));
输出:
<span>span</span>
获得上一个兄弟元素节点:
输入:
var span = document.querySelector('span');
console.log(getPrevElement(span));
输出:
<div>div</div>
JavaScript封装函数:获取下一个/上一个兄弟元素节点的更多相关文章
- Shell $?获取函数返回值或者上一个命令的退出状态
Shell $?获取函数返回值或者上一个命令的退出状态 来自:互联网 时间:2021-01-12 阅读:2 $? 是一个特殊变量,用来获取上一个命令的退出状态,或者上一个函数的返回值. 所谓退出状态, ...
- 原生JavaScript 获取下一个/上一个同胞元素
看JavaScript遇到的问题,研究了下 获取上一个或者下一个同胞元素,使用很多人会立马想到JQuery prev() 和 next() 的确非常方便.那么原生的JavaScript该怎么获取 上 ...
- getNextElement( )函数——获取下一个特定的元素节点
function getNextElement(node){ //定义getNextElement()函数 if (node.nodeType==){ //条件:如果node参数nodetype属性为 ...
- javascript 在一个函数参数中包含另一个函数的引用
javascript函数的参数包含另一个函数的情形: <script> //b函数的参数func为另一个函数 function b(a, func) { alert(a); //调用参数 ...
- javascript封装函数入门
封装函数的入门 一.使用函数有两步: 1.定义函数,又叫声明函数, 封装函数. 定义函数的三个要素:功能,参数,返回值. function 函数名(形参){ 函数代码 return 结果} //2.调 ...
- 怎样获取当前文档所有的元素节点(即html标签节点)
方法1. 使用 document.getElementsByTagName("*"); 方法2. 使用document.querySelectorAll("*" ...
- kubernetes获取崩溃容器/上一个容器的应用日志
kubectl logs命令将显示当前容器的日志.当你想知道为什么前一个容器终止时,你想看到的是前一个容器的日志,而不是当前容器的.可以通过添加--previous选项来完成: $ kubectl l ...
- 关于jQuery获取不到动态添加的元素节点的问题
遇到问题: 当我获取 $("#art-list")页面元素后去在后面追加标签的时候(append),在下面用 $(selector) 获取刚刚添加的标签,发现怎么都获取不到. 问题 ...
- js获取上一个兄弟元素
需要用到的两个属性:previousSbiling和previousElementSibling previousSibling:获取元素的上一个兄弟节点:(既包含元素节点.文本节点.注释节点) pr ...
随机推荐
- Mac本地生成SSHKey的方法
1. 查看秘钥是否存在 打开终端查看是否已经存在SSH密钥:cd ~/.ssh 如果没有密钥则不会有此文件夹,有则备份删除, 也可以直接删除, 2.生成新的秘钥, 命令如下 $ssh-keygen ...
- 【平台开发】— 4.mysql建库建表
本想着把前端脚手架run起来了,然后就可以借着登录来捋一下前后端交互的过程.但是后端导入JPA的时候就发现了,还没有数据库. 既然是本着学习的目的,那咱也不想只在后端写死返回的数据,要做就做全套. 一 ...
- SpringSecurity中的Authentication信息与登录流程
目录 Authentication 登录流程 一.与认证相关的UsernamePasswordAuthenticationFilter 获取用户名和密码 构造UsernamePasswordAuthe ...
- Tomcat9w.exe无法启动为started
问题: startup.bat可以正常启动,http://localhost:8080/ 可以正常访问.但是Tomcat9w.exe无法启动为started,一直为Stopped. 解决方案: 如下图 ...
- Q200510-01: 求部门工资最高的员工
问题: 求部门工资最高的员工 Employee 表包含所有员工信息,每个员工有其对应的 Id, salary 和 department Id. +----+-------+--------+----- ...
- Hint usenl usage /*+ leading(emp,dept) usenl(emp) */
SQL> select /*+ leading(emp,dept) usenl(emp) */ emp.*,dept.* from tb_emp03 emp,tb_dept03 dept whe ...
- leetcode刷题-70爬楼梯
题目 假设你正在爬楼梯.需要 n 阶你才能到达楼顶. 每次你可以爬 1 或 2 个台阶.你有多少种不同的方法可以爬到楼顶呢? 注意:给定 n 是一个正整数. 思路 最开始使用的是回溯的方法,但是时间效 ...
- Selenium-WebDriver安装
一.chrome浏览器: 根据chrome浏览器版本,下载对应的驱动 chromedriver版本 支持的Chrome版本 v2.37 v64-66 v2.36 v63-65 v2.35 v62-64 ...
- 关于Java代理那些事儿
代理是啥?就是代替你执行你持有的主要功能,并且能在你的基础之上完成一些其他的功能.代理的目的就是生成一个和原对象具有同样功能的对象.在Java中,代理是一种设计模式.在Spring的面向切面编程(AO ...
- wireshark在ubuntu系统中的正确安装方法
以前一直在使用wireshark这个网络工具,最近在用来抓包学习MQTT协议的时候,发现wireshark暂时还未加入对MQTT协议分析的原生支持,网上搜了一下,可以自己用插件的形式扩展wiresha ...