Chrome中JS代码仅首次生效，刷新后失效的问题排查

问题根源 #

1. if语句逻辑错误：原代码中if (aa[i].type == 'checkbox')未加花括号，仅aa[i].checked = true属于判断分支，bb[i].textContent.bold()会在所有循环迭代中执行。当遍历到非checkbox的input（比如测试页里的提交按钮）时，bb[i]不存在（测试页只有3个label，却有4个input），直接访问bb[i].textContent就会抛出Cannot read properties of undefined错误，中断代码执行。
2. 加粗方法无效：textContent.bold()是字符串方法，仅返回带<b>标签的文本字符串，不会直接修改DOM元素的样式或内容，原代码实际上没有真正实现加粗效果。
3. 索引关联不可靠：通过索引i直接对应input和label，依赖两者数量完全一致且顺序一一对应，一旦页面结构变化就会出错。

修复后的代码 #

方案一（适配测试页结构，checkbox嵌套在label内部）

(function() {
    var inputs = document.getElementsByTagName("input");
    for (var i = 0; i < inputs.length; i++) {
        var input = inputs[i];
        if (input.type === 'checkbox') {
            input.checked = true;
            // 获取checkbox的父元素label
            var label = input.parentNode;
            if (label && label.tagName === 'LABEL') {
                label.style.fontWeight = 'bold';
            }
        }
    }
})();

方案二（通用方案，支持label通过for属性关联checkbox）

(function() {
    var inputs = document.getElementsByTagName("input");
    for (var i = 0; i < inputs.length; i++) {
        var input = inputs[i];
        if (input.type === 'checkbox') {
            input.checked = true;
            // 获取当前checkbox关联的所有label
            var labels = input.labels;
            if (labels) {
                for (var j = 0; j < labels.length; j++) {
                    labels[j].style.fontWeight = 'bold';
                }
            }
        }
    }
})();

修复说明 #

• 给if语句添加花括号，确保只有checkbox对应的逻辑会执行，避免遍历到非checkbox时触发错误。
• 使用style.fontWeight = 'bold'直接修改label的CSS样式，既保留label内部的结构（比如测试页里的input），又能真正实现加粗效果。
• 通过input自身的关联关系（父节点或labels属性）获取对应label，彻底避免索引错位问题，无论页面结构如何变化，都能准确找到目标元素。

内容的提问来源于stack exchange，提问作者Newb