原生JS怎么获取元素的兄弟节点

<div id="box">
<div class="user">
<label>账号：<input type="text"><span></span></label>
</div>
<div class="pwd">
<label>密码：<input type="password"><span></span></label>
</div>
</div>
比方我想获取账号这个input后面的span
用nextSbiling这个没成功，按网上说法要去空格，貌似也没成
另外：原生JS里onblur只能写在行内吗，不能document.getElementById().onblur(function(){})这样吗
之前一直用JQUERY写，现在想多学学原生JS，求解答，谢谢

5 个解决方案

#1

本帖最后由 showbo 于 2016-12-16 17:03:07 编辑

你先搞清楚事件怎么添加。。是xxx.onblur=function(){}...不是xxx.onblur(function(){})，不要和jqeury搞混了
如果input和span间没有空格是肯定能获取到的

<label>账号：<input type="text" id="txt1"><span></span></label><br />
<label>密码：<input type="password" id="txt2"><span></span></label>

<script>
    function txtBlur() { this.nextSibling.innerHTML = this.id + '-span' }
    document.getElementById('txt1').onblur = document.getElementById('txt2').onblur = txtBlur
</script>

#2

兄弟节点的，成功了，是我把nextSibling拼写错了
然后
原生JS里onblur只能写在行内吗，不能document.getElementById().onblur(function(){})这样吗？
这个请解答下

#3

ANY.addEventListener("事件名",fn) 这是原声js的绑定监听事件标准写法

#4

还有一种是ANY.on事件名=function(){}
最不推荐的一种是在html页面起始标签中<ANY onclick=fn()>

#5

引用 2 楼 qq_36509661 的回复:

兄弟节点的，成功了，是我把nextSibling拼写错了
然后
原生JS里onblur只能写在行内吗，不能document.getElementById().onblur(function(){})这样吗？
这个请解答下

认真看代码啊。。代码不是就写外面了，