Javascript 确定DIV中的文本是否为粗体

我有一个如下所示的HTML结构

<div>Some text</div>
<div class='inBold'>Hello <b>Dude</b></div>
<div class='inBold'>Hello <span class="boldText">Dude</span></div>
<div class='inBold'>Hello <strong>Dude</strong></div>

现在我只想看看弦乐花花公子是否在所有的div中都用粗体。似乎处理HTML会很麻烦，因为有很多方法可以提供粗体格式。如何识别DIV中的某些文本是否为粗体。请在这方面帮助我

var divs=document.getElementsByClassName（'inBold'）；
var divs = document.getElementsByClassName('inBold');
for(var i = 0; i < divs.length; i++)
    console.log(isBold(divs[i]));

function isBold(node){
     var childNodes = node.childNodes;
     for(var i = 0; i < childNodes.length; i++)
         if(childNodes[i].nodeType != 3 && (childNodes[i].className.indexOf('boldText') != -1 
            || childNodes[i].tagName == 'B'
            || childNodes[i].tagName == 'STRONG'))
             return true;
     return false;
}

对于（变量i=0；i

---

请参见

如果可以使用jQuery，则可以使用以下示例：

var consideredBoldsSelector = 'b, strong, span.boldText';
var expectedCount = $("div.inBold").length
var bAllMatched = $("div.inBold *:contains('Dude'):first-child").filter(consideredBoldsSelector).length === expectedCount

使用

expectedCount

可以控制期望的“点击次数”，使用consideredBoldsSelector可以轻松为粗体添加类似css的选择器

---

注意：contains是区分大小写的。

可能与此类似，这会选择页面上的每个元素，然后检查是否设置为“bold”（也可以是“by”或“by”）。如果它符合此规则，则该元素将记录到控制台

注意：getComputedStyle检测“b”和“strong”，因此不需要额外的测试来检测这些元素

CSS

HTML

在

当然，这是检查页面上的所有内容，但使用此原则查找所需文本并仅检查这些元素是相当简单的

通过更改为此行：

if (element.textContent === "Dude" && window.getComputedStyle(element).fontWeight.toLowerCase() === "bold") {

在

注意：旧浏览器不支持getComputedStyle，也不支持getComputedStyle

并非所有旧浏览器都支持document.querySelectorAll

Array.forEach中有很多垫片，或者您也可以将其更改为for或while循环

getComputedStyle是一个问题，但是如果您需要更跨浏览器的东西，那么这应该会给您更广泛的支持

Javascript

Array.prototype.forEach.call(document.querySelectorAll("*"), function (element) {
    if (window.getComputedStyle(element).fontWeight === "bold") { // can also use .getPropertyValue("font-weight")
        console.log("bold: ", element);
    }
});

function walkTheDOM(node, func) {
    func(node);
    node = node.firstChild;
    while (node) {
        walkTheDOM(node, func);
        node = node.nextSibling;
    }
}

function textContent(node) {
    if (typeof node.textContent !== "undefined" && node.textContent !== null) {
        return node.textContent;
    }

    var text = ""

    walkTheDOM(node, function (current) {
        if (current.nodeType === 3) {
            text += current.nodeValue;
        }
    });

    return text;
}

function camelCase(string) {
    return string.replace(/-([a-z])/g, function (matched) {
        return matched[1].toUpperCase()
    });
}

function getComputedStyleProperty(element, property) {
    if (!window.getComputedStyle) {
        if (document.defaultView && document.defaultView.getComputedStyle) {
            return document.defaultView.getComputedStyle(element).getPropertyValue(property);
        } else {
            var camelCased = camelCase(property);

            if (element.currentStyle) {
                return element.currentStyle[camelCased];
            } else {
                return element.style[camelCased];
            }
        }
    } else {
        return window.getComputedStyle(element).getPropertyValue(property);
    }
}

var elements = document.getElementsByTagName("*"),
    length = elements.length,
    i = 0,
    element;

while (i < length) {
    element = elements[i];

    if (textContent(element) === "Dude" && getComputedStyleProperty(element, "font-weight") === "bold") {
        console.log("bold: ", element);
    }

    i += 1;
}

函数漫游域（节点，函数）{
func（节点）；
node=node.firstChild；
while（节点）{
漫游域（节点，函数）；
node=node.nextSibling；
}
}
函数textContent（节点）{
if（typeof node.textContent！=“未定义”&&node.textContent！==null）{
返回node.textContent；
}
var text=“”
walkTheDOM（节点、功能（当前）{
if（current.nodeType==3）{
text+=current.nodeValue；
}
});
返回文本；
}
函数大小写（字符串）{
返回字符串。替换（/-（[a-z]）/g，函数（匹配）{
返回匹配的[1]。toUpperCase（）
});
}
函数getComputedStyleProperty（元素，属性）{
如果（！window.getComputedStyle）{
if（document.defaultView&&document.defaultView.getComputedStyle）{
返回document.defaultView.getComputedStyle（元素）.getPropertyValue（属性）；
}否则{
var camelCased=camelCase（财产）；
if（element.currentStyle）{
返回元素.currentStyle[camelCased]；
}否则{
返回元素。样式[camelCased]；
}
}
}否则{
返回窗口.getComputedStyle（元素）.getPropertyValue（属性）；
}
}
var elements=document.getElementsByTagName（“*”），
长度=元素。长度，
i=0，
元素；
while（i

---

在

上，这将创建一个treeWalker，并检查文本内容为“Dude”的每个节点的粗体是否合适，而不考虑类名或标记名：

var treeWalker = document.createTreeWalker(document.body, NodeFilter.SHOW_ALL, filter, false);

function filter(node) {
    if (node.textContent === 'Dude') {
        var computed = window.getComputedStyle(node, null);

        if(computed && computed.getPropertyValue("font-weight")=== "bold"){
            return NodeFilter.FILTER_ACCEPT;
        }

    } else {
        return NodeFilter.FILTER_SKIP;
    }
}

while(treeWalker.nextNode()) {
    //    Elements with bold text
    console.log(treeWalker.currentNode)
};

您可以使用该函数确定元素的当前值。这包括从父元素继承的任何值：

// get a pointer to your element somehow
var elem;

// get the current weight
var weight = window.getComputedStyle(elem,null).getPropertyValue("font-weight");

---

可以在中找到从数值到标识符（如

bold

）的“映射”。

这将查找特定的类名或元素类型，而不是以一般方式。但是很好，旧的浏览器不支持samegetElementsByClassName，但是有很多垫片。必须注意在类名字符串上使用indexOf，因为可能有一个名为“boldTextItalic”的类，该类也会匹配，但不一定是粗体的。@Xotic750该链接在哪里适用于当前上下文？“堆栈溢出是一个问答网站”，两周内没有任何活动，你找到解决办法了吗？如果不是下面建议的答案，那么您可以分享您的答案，甚至将其标记为您选择的问题答案。“这个网站是关于获取答案的”，引用自上面的链接。+1用于使用快速且经常被遗忘的TreeWalker，但必须注意的是，旧浏览器不支持这一功能。值得注意的是，旧浏览器不支持“getComputedStyle”，在一些较旧的internet explorer版本上，您需要使用“currentStyle”示例来说明它的工作原理，尽管您必须指定哪些内容被视为“粗体”，而不是检测它：

function walkTheDOM(node, func) {
    func(node);
    node = node.firstChild;
    while (node) {
        walkTheDOM(node, func);
        node = node.nextSibling;
    }
}

function textContent(node) {
    if (typeof node.textContent !== "undefined" && node.textContent !== null) {
        return node.textContent;
    }

    var text = ""

    walkTheDOM(node, function (current) {
        if (current.nodeType === 3) {
            text += current.nodeValue;
        }
    });

    return text;
}

function camelCase(string) {
    return string.replace(/-([a-z])/g, function (matched) {
        return matched[1].toUpperCase()
    });
}

function getComputedStyleProperty(element, property) {
    if (!window.getComputedStyle) {
        if (document.defaultView && document.defaultView.getComputedStyle) {
            return document.defaultView.getComputedStyle(element).getPropertyValue(property);
        } else {
            var camelCased = camelCase(property);

            if (element.currentStyle) {
                return element.currentStyle[camelCased];
            } else {
                return element.style[camelCased];
            }
        }
    } else {
        return window.getComputedStyle(element).getPropertyValue(property);
    }
}

var elements = document.getElementsByTagName("*"),
    length = elements.length,
    i = 0,
    element;

while (i < length) {
    element = elements[i];

    if (textContent(element) === "Dude" && getComputedStyleProperty(element, "font-weight") === "bold") {
        console.log("bold: ", element);
    }

    i += 1;
}

var treeWalker = document.createTreeWalker(document.body, NodeFilter.SHOW_ALL, filter, false);

function filter(node) {
    if (node.textContent === 'Dude') {
        var computed = window.getComputedStyle(node, null);

        if(computed && computed.getPropertyValue("font-weight")=== "bold"){
            return NodeFilter.FILTER_ACCEPT;
        }

    } else {
        return NodeFilter.FILTER_SKIP;
    }
}

while(treeWalker.nextNode()) {
    //    Elements with bold text
    console.log(treeWalker.currentNode)
};

// get a pointer to your element somehow
var elem;

// get the current weight
var weight = window.getComputedStyle(elem,null).getPropertyValue("font-weight");