简体中文(ZH-CN) English(EN) 繁体中文(ZH-TW) 日本語(JA) 한국어(KO) Melayu(MS) Français(FR) Deutsch(DE)
javascript - html中的空格影响js节点操作怎么办？
黄舟
黄舟 2017-04-10 16:15:42
0
3
462
<html>  
<head><title>DOM Test</title></head>  
<body>  
<table>   
    <tr>   
    <td id="TEST">  
        <input type="submit" value="确定"/>  
        <input type="button" value="取消"/>  
    </td>  
    </tr>   
</table>  
  
<script type="text/javascript">  

    var td = document.getElementById("TEST");  
    alert(td.childNodes.length);    //结果为4   

</script>  
  
</body>  
</html>

类似的还有节点操作等，由于元素书写时存在空白换行符等，所以导致在操作DOM节点出现问题？

问一下，这个问题怎么解决呢？

将html代码压缩，但是好多网站都没有压缩啊？到底怎么解决呢？

谢谢了！

黄舟
黄舟

人生最曼妙的风景，竟是内心的淡定与从容！

모든 응답(3)
大家讲道理
大家讲道理2017-04-10 16:17:42 3층

childNodes会把文本节点也获取了， input前后都有个文本节点。
你可以用td.children.length来获取元素节点的个数，这样就对了

좋다 +0
답글 추가
迷茫
迷茫2017-04-10 16:17:42 2층

这是正常现象，浏览器在解析节点中空白符时，会把它当作文本节点，所以在遍历子节点时应该对文本节点做特殊处理，可以利用Document类型的nodeType属性过滤文本节点：

var td = document.getElementById("TEST");  
var childs=[],i,len,node;
for(i=0,len=td.childNodes.length;i<len;i++){
    node=td.childNodes[i];
    //过滤文本节点
    if(node.nodeType!=3){
        childs.push(node);
    }
}
alert(childs.length);    //结果为2
좋다 +0
답글 추가
左手右手慢动作
左手右手慢动作2017-04-10 16:17:42 1층

你用错方法了

td.childElementCount
좋다 +0
답글 추가
인기 주제
더>
인기 기사
인기 튜토리얼
더>
관련 튜토리얼
인기 추천
최신 강좌
최신 다운로드
더>
웹 효과
웹사이트 소스 코드
웹사이트 자료
프론트엔드 템플릿
회사 소개 부인 성명 Sitemap
PHP 중국어 웹사이트：공공복지 온라인 PHP 교육，PHP 학습자의 빠른 성장을 도와주세요！