-6

我正在使用以下我无法控制的传入 HTML 结构：

<div id="someRandom1">
    <div id="someRandom2">
        <div id="someRandom3">
            <div id="someRandom4">
                 ...
                     <p>Actual content</p>
                     <ul>
                         <li>This is a thing I need too</li>
                     </ul>
                     <a href="">And this</a>
                     <p>Some more content</p>
                 ...
            </div>
        </div>
    </div>
    <p id="additionalGarbage">Don't need this</p>
</div>

我想要完成的是最终得到以下结果：

<p>Actual content</p>
<ul>
    <li>This is a thing I need too</li>
</ul>
<a href="">And this</a>
<p>Some more content</p>

我不知道会有多少个 div，但我知道只有一个子 div，最后一个 div 里面的东西就是我需要的。逻辑可能应该是检查子 div，获取内容并检查子 div。如果是另一个子 div，请再次检查，否则最终返回内容。到目前为止，我编写的每个循环都会使 Chrome 崩溃，所以我显然写错了。请指教。

编辑：在所有评论之后，我会尝试在一些项目符号中使其更加简洁。

  • 有未知数量的嵌套 div。（我对此没有任何控制权）。
  • 子 div 可能是也可能不是父 div 内的第一个元素。
  • 最深的 div 中的 html 结构需要保持完整。

奖励：最少的代码行。

4

2 回答 2

1

假设...

  • 您拥有最高级别（因为您说您是从 API 获取的）
  • 您只需要删除最外层的 div （按标签名称）
  • 要删除的 div 将是其兄弟姐妹中的第一个 div （尽管周围可能有其他名称不同的元素）

...你可以这样做：

// Assumes you have a handle on the root level
var node = $("#someRandom1");
var div = node.children("div")
while (div.length) {
  node = div.first()
  div = node.children("div")
}

// now node.children will be the content

alert(node.children().map(function(i, n) { return n.nodeName }).toArray())
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script>
<div id="someRandom1">
    <p class="garbage"></p>
    <div id="someRandom2">
        <p class="garbage"></p>
        <div id="someRandom3">
            <p class="garbage"></p>
            <div id="someRandom4">
                 ...
                     <p>Actual content</p>
                     <ul></ul>
                     <a href=""></a>
                     <p></p>
                 ...
            </div>
        </div>
        <p class="garbage"></p>
    </div>
    <p id="additionalGarbage"></p>
</div>

这只是从最外层开始div，如果它至少有一个 div div，则向下遍历。所以你最终node成为最里面的连续div孩子并node.children持有它的内容节点。

于 2016-04-14T15:21:06.170 回答
0

这应该可以解决问题：

document.getElementById( 'someRandom1' ).querySelector( ':not(div)' ).parentNode.innerHTML
于 2016-04-14T15:31:09.887 回答