2

あらゆる種類の要素を含む div をループしようとしました。問題は、私の例に同じ結果が表示されることです。

サンプルコードのフィドルは次のとおりです。 http://jsfiddle.net/JLtCN/

したがって、私の例の html 構造は次のようになります。

<div class="somediv">
    <span>hello</span>
    <img src="someimg.jpg" width="20" height="20" />
    <p></p>
    <div><p>some text in a paragraph inside a div</p></div>
    <h2>Some h2 tekst</h2>
    <table>
        <tbody>
            <tr>
                <td>some text in a table cell</td>
            </tr>
        </tbody>
    </table>
</div>

私の目標は、html タグ内のすべてのコンテンツを取得することでした。そのようです、

tagtype: <span>, text: 'hello',
tagtype: <p>, text: 'some text in a paragraph inside a div'
etc.

これを正しく行う方法を知っている人はいますか？

4

3 に答える 3

3

これを試して：

$('.somediv *').each(function() {
    var hastext = $(this).text().length != 0;
    if(hastext) {
        console.log("type: " + $(this)[0].tagName + " text: " + $(this).text());
    }
});

デモ: http://jsfiddle.net/JLtCN/1/

重複を取り除きたい場合は、ログに記録されたアイテムを配列に保存し、ログに記録する前に配列にないかどうかを確認します。次のようにします。

また、逆の順序で実行されるようになったため、最下位の子インスタンスのみが取得されます。

var addedItems = new Array();

$.each($('.somediv *').toArray().reverse(), function() {
    var hastext = $(this).text().length != 0;
    if(hastext && addedItems.indexOf($.trim($(this).text())) == -1) {
        addedItems.push($.trim($(this).text()));
        console.log("type: " + $(this)[0].tagName + " text: " + $(this).text());
    }
});

デモ: http://jsfiddle.net/JLtCN/3/

于 2013-03-27T21:41:53.267 に答える
2

このようなもの：

var seenStrings = [],
    content = $.map(
        $(".somediv *"),
        function(element) {
            var text = $(element).text();
            if ($.inArray(text, seenStrings) !== -1) {
              return {
                  tagname: "<" + element.nodeName.toLowerCase() + ">",
                  text: $(element).text()
              };
            } else {
              return null;
            }
        }
    );
于 2013-03-27T21:37:34.863 に答える
1 
var walk_the_DOM = function walk(node, func) {
    func(node);
    node = node.firstChild;
    while (node) {
        walk(node, func);
        node = node.nextSibling;
    }
};

walk_the_DOM(document.body, function(node) {
    if(node.nodeType == 1){
        document.write(node.nodeName + ": " );
    }        
    if(node.nodeType == 3){
        document.write(node.nodeValue +" <br/>");
    }
});
于 2013-03-27T21:51:55.327 に答える