Question

如何在jquery中解析HTML字符串？

我有两种类型的html标签，我想从这些标签中获取文字

我无法为下面给出的html字符串选择标记

html就在这里

<p>
    <b><span>22:00</span></b>
    <span>
        <span>
            <b>ABCD</b>
        </span>
        <b> XYZ</b>
</span>
</p>
<p>
    <b><span >06:00</span></b>
    <span>
        <b>LMNOP</b> 
    </span>
</p>

和jquery代码

$(html).each(function() {
    $(this).find('p').each(function() {
        $(this).find('b span').eq(0).each(function() {
        });

        $(this).find('span b').eq(0).each(function() {
            console.log($(this).text());
        }); 
    });

我想一次性选择ABCD和XYZ，同样LMNOP

即输出应为ABCDXYZ和LMNOP

如何在jQuery中选择它？

Answer 1

您可以使用filter()检查所选元素b标记是否包含子元素。试试这个：

var $html = $("<p><b><span>22:00</span></b><span><span><b>ABCD</b></span><b> XYZ</b></span></p><p><b><span >06:00</span></b><span><b>LMNOP</b> </span></p>");

var $b = $html.find('b').filter(function() {
    return $(this).children().length == 0;
}).each(function() {
    console.log($(this).text());  
});

Example fiddle

Answer 2

我再看看你的尝试和预期的结果，并认为我确实想出你想要做的事情：

fiddle

$(html).find('p').each(function () {
    console.log($(this).find('span b').text());
});

结果（与您预期的“ABCDXYZ和LMNOP”相同）：

ABCDXYZ
LMNOP

Answer 3

仅基于提供的HTML 字符串，尝试：

$(html).each(function(){
    console.log( $('span b', this).text() );
});

<强>输出：

ABCD XYZ
LMNOP

证明： http://fiddle.jshell.net/mScSv/

使用$(html)我将HTML字符串转换为有效的jQuery对象。在这种情况下，字符串中有两个根元素，段落p，所以我可以直接运行它们。

请注意输出中的空格，因为HTML中有相同的空格。

Answer 4

<script type="text/javascript">
        /*
        here I assumed that the <b> tag contains alpha numeric characters or space
        for other characters regular expression should be changed.
        */
        var arr = $('body').html().match(/\<b\>[\sA-z0-9]*\<\/b\>/gi);
        var output = Array();
        var temp = '';
        for (i = 0; i < arr.length; i++) {
            var str = arr[i].replace('<b>', '');
            str = str.replace('</b>', '');
            temp += str;
            if (i % 2 != 0) {
                output.push(temp);
                temp = '';
            }
        }
        if (i % 2 != 0) {
            output.push(temp);
        }
        //the array output stores the required result
        for (item in output) {
            document.write(output[item] + '<br>');
        }

    </script>

在jquery中解析html字符串

4 个答案: