章节
问答
课签
笔记
评论
占位
占位

访问兄弟节点

1. nextSibling 属性可返回某个节点之后紧跟的节点(处于同一树层级中)。

语法:

nodeObject.nextSibling

说明:如果无此节点,则该属性返回 null。

2. previousSibling 属性可返回某个节点之前紧跟的节点(处于同一树层级中)。

语法:

nodeObject.previousSibling  

说明:如果无此节点,则该属性返回 null。

注意: 两个属性获取的是节点。Internet Explorer 会忽略节点间生成的空白文本节点(例如,换行符号),而其它浏览器不会忽略

解决问题方法:

判断节点nodeType是否为1, 如是为元素节点,跳过。

运行结果:

LI = javascript
nextsibling: LI = jquery

 

 

 

任务

试一试,编写get_previousSibling 函数,获得指定节点的上一个节点。

?不会了怎么办

function get_previousSibling(n)
{
var x=n.previousSibling;
while (x && x.nodeType!=1)
  {
  x=x.previousSibling;
  }
return x;
}

||
1
2
<!DOCTYPE HTML>
<html>
XXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXX
提交
重置代码
||

请验证,完成请求

由于请求次数过多,请先验证,完成再次请求

加群二维码

打开微信扫码自动绑定

您还未绑定服务号

绑定后可得到

  • · 粉丝专属优惠福利
  • · 大咖直播交流干货
  • · 课程更新,问题答复提醒
  • · 账号支付安全提醒

收藏课程后,能更快找到我哦~

使用 Ctrl+D 可将课程添加到书签

邀请您关注公众号
关注后,及时获悉本课程动态

举报

0/150
提交
取消
全部 精华 我要发布

最新回答 / 慕雪4430556
第一步:var x=document.getElementsByTagName("li")[0];  得到第一个li.第二步:var y=get_nextSibling(x);调用函数,第三步:var x=n.nextSibling;    此时节点变作文本节点,类型为3,进入while判断第四步:while (x && x.nodeType!=1){            x=x.nextSibling;        }判断后节点变作第二个li,类型为1.第五步:返回第二个节点对象给y...

最新回答 / 搬砖人干饭人
这个索引值为【4】的判断依据是什么啊如何判断 

最新回答 / 慕容8334558
通过tagName("li")获取的是所有li标签的数组,其中第二个ul里的li索引值为[3-5]

最赞回答 / 慕莱坞6487985
我的理解是这样的我是这样理解的首先childNodes属性在chrome,firefox等浏览器会把文本节点也算在内,nodeType = 1 判断是否是元素节点,;previousSibling上面没有子节点的时候返回null  所以当x = null 就表示上面已经没有子节点了while(x && x.nodeType != 1) &&操作符如果有一个是null,则返回null判断nodeType != 1 且 x !=null 当为True的时候进入循环, 为Fals...

最赞回答 / 几盎丶
首先这节教了两个结点属性(自己去查一查搞清方法和属性的区别)nextSibling    previousSibling下一个结点    前一个结点<ul id="u1">                   <li id="a">javascript</li>  文本元素                 <li id="b">jquery</li>   文本元素                 <li id="c">html<...

最新回答 / 宝慕林6934861
 var y=get_nextSibling(x)是调用函数,你将x的值代入到get_nextSibling(n)函数中去,此时函数里所有n变量替换为x,函数里var x 里面重新定义了一个x 你再吧替换后的结果赋值给x。

已采纳回答 / 流星64
function get_previousSibling(n),这是什么?这是一个带参数的函数,n为你传入的参数[4]是下标,这里表示的是获取第5个li,赋给z

最新回答 / 慕仔8517113
最后一个分号错了,可以跟别人的代码做参照,一步步用正确的代替自己的,缩小范围就好找了。然后吸取教训。

最新回答 / 我好怂的
<...图片...>你代码的121行后面的分号是用的中文,换成英文输入就可以了。

最新回答 / 旺仔窝窝头
这里的while(x&&x.nodeType!=1){x=x.previousSibling;}表示:当获取到的上一个兄弟节点x不是元素节点时,则继续循环获取,直到获取到的是元素节点才跳出循环,最后return x即可得到上一个相邻的兄弟元素节点。(nodeType=1:表示是元素节点,即标签。如:div、p、input...)

最赞回答 / RazorE
形式参数,占位用,当调用函数时,函数给它传的是什么值,就代表着n是什么值如代码中,当实参x的值传递给函数时,x就取代n的位置进行运算12var x=document.getElementsByTagName("li")[0];var y=get_nextSibling(x);

已采纳回答 / 旺仔窝窝头
1、node[1].previousSibling.innerHTML:这里获得的是第一个<li></li>后面的空白符(nodeType=3,innerHTML=undefined),也即node[1]的上一个兄弟元素。2、若想跳过空白文本:function get_previousSibling(n){ var x=n.previousSibling;//首先取得n的上一个兄弟x while(x&&x.nodeType!=1){//判断x是否为元素节点(no...

已采纳回答 / 慕仰1008517
这句代表的意思是【x不存在且x的节点类型不为1】的时候x不存在指x的值为null,x的节点类型不为1的时候指节点类型不为元素节点这句话可以拆开看x != 1 && x.nodeType!=1x != 1  =>  x不等于1,即x不存在x.nodeType!=1  =>  x的nodeType不为1,x的节点类型不为元素节点当两者都达成进入循环关于节点类型 1,2,3...等数字分别指代什么可以参考下图<...图片...>
全部 我要发布
最热 最新
只看我的

本次提问将花费2个积分

你的积分不足,无法发表

为什么扣积分?

本次提问将花费2个积分

继续发表请点击 "确定"

为什么扣积分?

账号登录 验证码登录

遇到问题
忘记密码

代码语言