查找自定义文本并使用 JavaScript 和 CSS 更改其颜色

Question

我正在构建一个网站，刚刚满足WordPress和自定义主题的限制，我可以轻松注入自定义Js或CSS，所以我的问题是...

如何在内容中查找★并设置其颜色

有关符号 https://www.htmlsymbols.xyz/unicode/U+2605 的更多信息

Answer 1

var headings = document.evaluate("//li[contains(., '★')]", document, null, XPathResult.ANY_TYPE, null );
var thisHeading = headings.iterateNext();
thisHeading.setAttribute('style', 'color: #f1c40f');

明白了！我留下了下面的标签，以防有人搜索此解决方案

CSS， Unicode， color， JavaScript， find

Answer 2

您可以遍历整个 dom 并搜索匹配项。

let allElements = document.getElementsByTagName("*");
for (let Element of allElements) {
for (let childNode of Element.childNodes) {
if (childNode.nodeType === 3) {
let valueUpper = childNode.nodeValue.toUpperCase()
if (valueUpper.includes(text)) {
Element.style.backgroundColor='#ff0000';
Element.style.color='#ffffff';
}
}
}
}

我使用了这段代码：https://stackoverflow.com/a/6132212/8781059