-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 が 1 つしかなく、最後の 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少なくとも 1 つの div がある場合はdiv、そこまでたどります。したがってnode、最も内側の連続するdiv子になり、node.childrenそのコンテンツ ノードを保持します。

于 2016-04-14T15:21:06.170 に答える