Question

我正在开发一个javascript书签，它将遍历并查找网页上的所有元素，其文本看起来像货币。然后使用每个元素，我找到它的字体大小并确定它是否有直通。价格和字体大小被推入一个数组。

我已将下面的代码放在一起，但我不确定它是否最有效。比赛也有错误。理想情况下，我希望能够直接磨练那些与正则表达式匹配的元素。

var ele = b.getElementsByTagName('*');
for(i=0; i<ele.length; i++) {
    //check iff innerhtml matches
    if(ele[i].innerHTML.match(/[$€£]\d{1,3}(,?\d{3})?(\.\d{2})?/g)) {
        var price = ele[i].innerHTML;
        var size = ele[i].style.fontSize;
        var lineThrough = ele[i].style.textDecoration;
        if(lineThrough != 'line-through' && price && size) {
            results.push({ size: size, price: price});
        }
    }
}

出于某种原因，这场比赛似乎并不完全匹配。

Answer 1

首先，如果你想匹配一个大于999,999.99的总和，正则表达式应该是：[$€£](\d{1,3})(,?\d{3})*(\.\d{2})?。在这里，我将?更改为*，这意味着“0或更多”，当“？”时意思是“零或一”。

如果您想要找到一个非严格格式的价格（例如300万美元），您可能想要为“可能”空格添加许可：[$€£]\s*(\d{1,3})\s*(,?\d{3}\s*)*(\.\d{2})?。

对象style仅包含直接为此元素指定的样式，但不包含继承的样式。要访问继承的样式，请使用window.getComputedStyle。

innerHTML属性返回所有嵌套节点的内容，因此您的函数将查找您要查找的元素的所有父元素。要查找当前节点文本，我使用firstChild属性，如果此属性为instance of Text（但我相信这是一个更优雅的解决方案）：

var ele = document.getElementsByTagName('*');
results = [];

for (i = 0; i < ele.length; i++)
{
    var el = ele[i];
    if (el.hasChildNodes && el.firstChild instanceof Text)
    {
        var price = el.firstChild.textContent.match(/([$€£]+)\s*(\d{1,3})\s*(,?\d{3}\s*)*(\.\d{2})?/g);
        if (price)
        {
            var style = window.getComputedStyle ? window.getComputedStyle(el) : el.style;
            var size = style.fontSize;
            var lineThrough = style.textDecoration;
            if (lineThrough != 'line-through' && price && size)
            {
                results.push({ size: size, price: price});
            }
        }
    }
}

如果要查找包含缩写的金额，可以将正则表达式扩展为：/([$€£]+)\s*(\d{1,3})\s*(,?\d{3}\s*)*(\.\d{2})?(\s*[K|M|MM|B|thousand|million|billion])*/g。

试图找到页面上与某个正则表达式匹配的所有元素

1 个答案: