javascript - 如何遍历某些特定的子节点

标签 javascript html

我有这个 DOM 树:

<li> 
data ....
  <br>
  data ...
  <img ... />
  <br>
  <script> ... </script>
  <span> data ... </span>
</li>

我如何循环遍历位于 li 本身和 script 元素之间的上述 li 元素的子元素,即 script 和 span 元素不在循环中...... 提前致谢!!

注意:我不想使用 JQuery,因为我的应用程序正在使用 Protoype,如果我同时使用它们会与 JQuery 冲突,如果有使用 Prototype 的快速解决方案,我将不胜感激。

最佳答案

这样的事情对你有用吗?

var child = liElement.firstChild;
while(child){
    if(child.nodeName.toLowerCase() == 'script'){
        break
    }
    //do your stuff here
    child = child.nextSibling;
}

请注意,如果您的示例中的“数据”是字符串,那么它们将作为文本节点的实例存在于子层次结构中。如果你需要对这些东西做特殊处理,你会想要做一个检查,比如

switch(child.nodeType){
case 3:
   //text Node
   break;
case 1:
   //Element node
   break;
default:
    //break;
}

checkout https://developer.mozilla.org/en/nodeType更多节点类型

关于javascript - 如何遍历某些特定的子节点,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/5165913/

相关文章:

javascript - 第一个编程游戏的问题(javascript/jQuery)

javascript - 为什么这在 TypeScript 中是不可能的 `export { add } from ' ./math' ;` ` const math = { add };`

javascript - 过滤路径数组的干净方法

javascript - 水平显示卡片列表,带有 Angular 和 MaterializeCSS 的 HTML/CSS

javascript - 我输入的输入值没有显示在 JavaScript 中

html - 关闭导航栏时,sidenav 上的元素名称也会折叠

html - Bootstrap Css Mobile 第一次调整大小问题

javascript - Cordova navigator.device 问题

javascript - 在 JavaScript 中跨浏览器调整浏览器窗口大小

html - 通过具有背景颜色的 div 实现透明度