使用javascript设置内联CSS值很容易.如果我想改变宽度,我有这样的HTML:
<div style="width: 10px"></div>
Run Code Online (Sandbox Code Playgroud)
我需要做的就是:
document.getElementById('id').style.width = value;
Run Code Online (Sandbox Code Playgroud)
它将更改内联样式表值.通常这不是问题,因为内联样式会覆盖样式表.例:
<style>
#tId {
width: 50%;
}
</style>
<div id="tId"></div>
Run Code Online (Sandbox Code Playgroud)
使用此Javascript:
document.getElementById('tId').style.width = "30%";
Run Code Online (Sandbox Code Playgroud)
我得到以下内容:
<style>
#tId {
width: 50%;
}
</style>
<div id="tId" style="width: 30%";></div>
Run Code Online (Sandbox Code Playgroud)
这是一个问题,因为我不仅不想更改内联值,如果我在设置之前查找宽度,当我有:
<div id="tId"></div>
Run Code Online (Sandbox Code Playgroud)
返回的值是Null,所以如果我有Javascript需要知道某些逻辑的宽度(我将宽度增加1%,而不是特定值),当我期望字符串"50%"时返回Null "真的没用.
所以我的问题是:我的CSS样式中的值不是内联的,我如何获得这些值?在给定id的情况下,如何修改样式而不是内联值?