<!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>js 原生方法获取所有兄弟节点</title>
</head> <body>
<ul>
<li id="first">1</li>
<li>2</li>
<li>3</li>
</ul>
<script type="text/javascript">
//方法一：
// function sibling(elem) {
// var r = [];
// var n = elem.parentNode.firstChild;
// for(; n; n = n.nextSibling) {
// if(n.nodeType === 1 && n !== elem) {
// r.push(n);
// }
// }
// return r;
// }
//方法二
function sibling(elm) {
var a = [];
var p = elm.parentNode.children;
for(var i = 0, pl = p.length; i < pl; i++) {
if(p[i] !== elm) a.push(p[i]);
}
return a;
} var siblings = sibling(document.getElementById('first'));
console.log(siblings);
</script>
</body> </html>
js 原生方法获取所有兄弟节点的更多相关文章
-
遍历DOM树，获取所有兄弟节点
获取兄弟节点的常用方法有: 方法 说明 siblings() 选取所有兄弟节点 next() 选取后面兄弟节点 nextAll() 选取所有后面的兄弟节点 nextUntil() 选取所有 ...
-
像jq那样获取对象的js原生方法
使用过jq的童鞋非常喜欢jq获取对象的方法,只要$()就可以获取,在此我封装一个js获取对象的方法 [注意]只对chrome,Firefox,opera,Safari,ie8及ie8以上版本有效 fu ...
-
JS原生方法实现瀑布流布局
html部分(图片都是本地,自己需要改动图片) p.p1 { margin: 0.0px 0.0px 0.0px 0.0px; font: 30.0px Consolas; color: #2b7ec ...
-
js原生方法传参的细节（面试必问）
废话不说,直接上题. slice(),接收两个参数,第一个为开始index(从0开始),第二个为结束的index(也是从0开始,但是不包括index本身,只到index-1).返回值是截取的数组,原数 ...
-
图片首尾平滑轮播(JS原生方法—节流)<;原创>;
首先给出HTML代码,要注意轮播图片表(#list)末尾加上第一个图片1.jpg,在首部加上最后一个图片5.jpg. <!DOCTYPE html> <html lang=" ...
-
js原生_获取url键值对
思路: 1.先对url进行处理,获取 ?后的字符串 postid=10457794&actiontip=保存修改成功') 2. 字符串通过&标识,不同参数转为数组 ["pos ...
-
JS原生方法被覆盖后的恢复办法
alert 被覆盖 今天装修博客园,调试了下JS代码发现 alert() 方法被官方覆盖了,查看源码得知 alert 的功能被替换成了 console.log. 恢复 var _frame = doc ...
-
js原生方法的重写
讲干货,不啰嗦,通过prototype可以获取到JavaScript的原型对象,进而可以在对象原型上添加新的属性和方法,当该方法与原方法名称一样时会覆盖原方法既:重写,当不一样时既:添加 如:实现数组 ...
-
JS原生方法实现jQuery的ready()
浏览器加载页面的顺序: 1. 解析HTML结构 2. 加载外部脚本和样式表文件 3. 解析并执行脚本代码 4. 构造HTML DOM模型==ready() 5. 加载图片等组件 6. 页面加载完毕== ...
随机推荐
-
Web测试的常用测试用例与知识
1. Web测试中关于登录的测试 2. 搜索功能测试用例设计 3. 翻页功能测试用例 4. 输入框的测试 5. Web测试的常用的检查点 6. 用户及权限管理功能常规测试方法 7. Web测试之兼容性 ...
-
HTML,javaScript,DOM详解
HTML DOM 教程 DOM 教程 DOM 简介 HTML DOM 定义了访问和操作 HTML 文档的标准方法. DOM 将 HTML 文档表达为树结构. HTML DOM 树 HTML DOM 简 ...
-
iOS 10 消息推送（UserNotifications）秘籍总结（二）
背景 上一篇博客iOS 10 消息推送(UserNotifications)秘籍总结(一)发布后被 简书编辑推荐至首页,这着实让我受宠若惊啊.可是好事不长,后面发生了让我伤心欲绝的事,我的女朋友不要我 ...
-
括弧匹配检验（check）
/*题目:括弧匹配检验 检验给定表达式中括弧是否正确匹配 (两种括弧“( ) ”“[]" ,正确输出OK,错误则输出wrong. 2016年8月8日07:24:58 作者:冰樱梦 */ # ...
-
《Linux内核分析》 week6作业-Linux内核fork()系统调用的创建过程
一.进程控制块PCB-stack_struct 进程在操作系统中都有一个结构,用于表示这个进程.这就是进程控制块(PCB),在Linux中具体实现是task_struct数据结构,它主要记录了以下信息 ...
-
JSON在线解析，新版本JSON在线解析
SOJSON,出了新版本的JSON在线解析,真的很好用,可以上下版本.左右版本.效果图如下.它的网址是:http://www.sojson.com/simple_json.html SOJSON集成了 ...
-
Being a Good Boy in Spring Festival（尼姆博弈）
Being a Good Boy in Spring Festival Time Limit: 1000/1000 MS (Java/Others) Memory Limit: 32768/32768 ...
-
【java】反射简单示例
package 反射; public class Test反射 { public static void main(String[] args) { System.out.println(Runtim ...
-
April Fools Contest 2017 题解&;源码(A,数学 B,数学 C,数学 D,字符串 E,数字逻辑 F,排序,卡时间,G,数学)
A. Numbers Joke time limit per test:2 seconds memory limit per test:64 megabytes input:standard inpu ...
-
urllib.parse.urlencode
urllib.request.urlopen(url,data,timeout) 其中如果data被赋值,则请求的方式就会由get转为post,而post需要提供一些待处理的数据. 这些待处理的数据需 ...