javascript - 我用于更改 css 的 javascript 脚本似乎无法正常工作

Question

function normToggle(){
document.getElementById('normToggle').onclick = function(){
    if(document.getElementById('normToggle').checked){
    document.getElementsByTagName('add').style.verticalAlign= 'baseline';
    }else{
        document.getElementsByTagName('add').style.verticalAlign= 'super';
    }
};
document.getElementsByTagName('add').style.verticalAlign= 'super';
document.getElementById('normToggle').checked = false;
}

所以我尝试使用复选框来更改“添加”标签的样式。他们的垂直对齐是 super 第一，然后我让他们改变正常，但他们没有回应。 smae 文件中的另一个 javascript 工作正常。

Answer 1

getElementsByTagName返回一个 HTML 集合——您需要遍历集合以更改集合中每个元素的样式

像这样:

function normToggle() {
    var setAlign = function (align) {
        [].forEach.call(document.getElementsByTagName('add'), function(tag) {
            tag.style.verticalAlign = align;
        });
    }
    document.getElementById('normToggle').addEventListener('click', function() {
        setAlign(this.checked ? 'baseline' : 'super');
    });
    setAlign('super');
    document.getElementById('normToggle').checked = false;
}

现在查看代码，您不太可能拥有名为 <add> 的元素!!!这是您的 HTML 中的某种错误吗？