• ie下nextSibling一些bug


    众所周知(如果不知请百度之)nextSibling与previousSibling是查找元素的下一,上一,同级元素。在标准dom浏览器下,会首先查找元素与元素之间的text节点。而ie8以及以前则直接查找目标元素节点。

    但是并不是所有情况下ie8及以前浏览器会乖乖查找目标节点。它们在遇到几个问题时会有问题

    No.1  previousSibling查找上一元素

    如果要查找的前一是内联元素,如span,i之类的,则返回object.但是!其实它返回的跟谷歌一样是text节点。它无法返回正常的上一节点。

    <span>111</span>
    <div id="a">222</div> 
    
    ;(function(){
    	var div=document.getElementById('a');
    	alert(div.previousSibling);//object
            alert(div.previousSibling.nodeType);//3
    alert(div.previousSibling.tagName);//undefined
    })()

      

    No.2  nextSibling查找下一元素,当自己本来是内联元素的时候,无法正常查找下一元素节点。返回的是跟谷歌一样的text节点。

    <span id="a">111</span>
    <span>222</span>  
    
    ;(function(){
    	var div=document.getElementById('a');
    	alert(div.nextSibling);//object
    	alert(div.nextSibling.nodeType);//3
    	alert(div.nextSibling.tagName);//undefined
    })()
    

    解决:

    最好也是最简单的方法就是像w3school那样写。这样的话可以避免很多ie的兼容包括用谷歌nextElementSibling的兼容。

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

      

  • 相关阅读:
    广东发展银行系统分析师面试问题
    软件开发团队中的个人绩效评价
    高并发下的HashMap问题
    HashMap之equals和hashCode小陷阱
    Java面试中的多线程问题
    Java IO设计模式
    Java IO 流 设计模式
    关于bug的沟通
    Cookie/Session机制详解 <转>
    request.get... getHeader 能取得的信息 参数
  • 原文地址:https://www.cnblogs.com/ihqn19/p/3243568.html
Copyright © 2020-2023  润新知