javascript - Javascript：格式化字符串并避免多次替换

Question

我有以下字符串：

var str='
                <span class="productName">Basa fillets</span><br>
                Brand: 
                <span class="brandName">COMPLIMENTS</span><br>
                400 <abbr title="Gram" lang="en">gr</abbr>
            '

我需要得到'400'（可以是一个词，甚至是一个句子）。到目前为止我所拥有的是：

d = str.replace(/<br>/g,'').replace(/<.*<\/.*>/g,'').replace(/\n/g,'').replace(/ */g,'').replace(/brand:/i,'');

它有效，但是......好吧，我相信我可以做得更好。我的代码中有很多类似的排队替换，我想知道如何改进它，所以我更多的是寻找一般答案而不是特定解决方案。

谢谢！

Answer 1

您可以在其上使用 DOM 方法（它是HTML），而不是使用字符串工具/正则表达式。

首先，您制作一个“假” div 并将 HTML 添加到其中。

var str="\
                <span class=\"productName\">Basa fillets</span><br>\
                Brand: \
                <span class=\"brandName\">COMPLIMENTS</span><br>\
                400 <abbr title=\"Gram\" lang=\"en\">gr</abbr>\
            ";

var fakeDiv = document.createElement('div');
fakeDiv.innerHTML = str;

然后只需使用普通的 DOM 遍历方法来获取您需要的节点。有很多方法可以访问元素，具体取决于您的 HTML。

var brandName = fakeDiv.getElementsByClassName('brandName');

var textNode = brandName[0].nextSibling.nextSibling;

console.log(textNode.nodeValue.trim());

演示：http: //jsfiddle.net/aqpgV/

或者，您可以从<abbr>元素开始并向后工作。

var gram = fakeDiv.getElementsByTagName('abbr');

var textNode = gram[0].previousSibling;

console.log(textNode.nodeValue.trim());

演示：http: //jsfiddle.net/aqpgV/1/

无论您如何穿越，都取决于您:-)

Answer 2

正则表达式

class="brandName">[^<]+</span><br>[^\w]+([^<]+) <abbr title=

调试演示

注意：第 1 组将包含您想要的项目。

Answer 3

如果你想使用正则表达式，你可以做这样的事情。

    var str="\
            <span class=\"productName\">Basa fillets</span><br>\
            Brand: \
            <span class=\"brandName\">COMPLIMENTS</span><br>\
            400 <abbr title=\"Gram\" lang=\"en\">gr</abbr>\
        ";

    var myRegexp = /COMPLIMENTS<\/span><br>\W(.*?) <abbr /g;
    var match = myRegexp.exec(str);
    alert(match[1]);