1

如何在 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和，同样XYZLMNOP

即输出应该是ABCDXYZ和LMNOP

如何在 jQuery 中选择它？

4

4 回答 4

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());  
});

示例小提琴

于 2013-10-30T13:35:52.587 回答
1

我再次查看了您的尝试和预期结果，并认为我实际上已经弄清楚了您要做什么：

小提琴

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

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

ABCDXYZ
LMNOP

于 2013-10-30T14:00:34.760 回答
0 
<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>
于 2013-10-30T14:17:29.943 回答
0

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

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

输出：

ABCD XYZ
LMNOP

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

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

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

于 2013-10-30T13:36:10.347 回答