Question

function changemysize(myvalue) { 
    var div = document.getElementById( "content" );
    div.style.fontSize = myvalue + "em";
    document.cookie="mysize=" + myvalue;
}

这会更改内容div中所有文本的大小，这很棒。

它还会更改任何表单输入字段的大小，这不是很棒。

排除＆＃34;内容＆＃34;内的HTML表单字段的好方法是什么？ div来自这个功能？

---------更多信息----------

我在标题中使用此函数来动态更改标题下方所有文本的字体大小。

<div id="adjust">Click to Adjust Size: 
    <span style="font-size: 1em;">
        <a href="javascript:void(0);" onClick="changemysize(1);">A</a>
    </span>
    <span style="font-size: 1.2em;">
        <a href="javascript:void(0);" onClick="changemysize(1.2);">A</a>
    </span>
    <span style="font-size: 1.4em;">
        <a href="javascript:void(0);" onClick="changemysize(1.4);">A</a>
    </span>
</div>

由于我的标题以<div id="content" class="site-content">结尾，因此所有页面内容都会变大，包括表单字段。有没有办法排除它们？

Answer 1

您可以获取div的子项，然后单独设置其字体大小，检查它们是否为<input>字段，如下所示：

JavaScript的：

// The code is self-explanatory, ask though if you need help
function changemysize(myvalue) { 
    var childs = document.getElementById( "content" ).children;

    for(var i = 0; childs[i]; i++){
        if(childs[i].tagName !== "form")
            childs[i].style.fontSize = myvalue + "em";
    }

    document.cookie="mysize=" + myvalue;
}

changemysize(20);

Demo（注意输入字段仍然很小）

Answer 2

这是一个CSS交易。我最终添加了一个设置字体大小（必须是'px'而不是'em'）到所有表单字段，这样就可以了。

从getelementbyid中排除表单元素

2 个答案: