Question

在CSS中我们可以做到：

div { font-size:20px }

设置所有div的默认字体大小。有没有办法用JavaScript更改元素的默认样式？

或者，我如何找到并设置上述样式规则？您可以按名称搜索document.styleSheets[0].cssRules来查找课程，但我不知道如何找到div的样式。

编辑：

哎呀，答案就在我的问题中。

我的困惑来自于试图改变一次为多个元素设置的规则。

所以你能够如上所述找到并改变div的CSS规则。

我不知道你如何改变多个定义的规则：

div,span { font-size:20px }

您无法通过搜索div，span或div,span找到该规则。

Answer 1

如果您想要更改已确定的div的样式，您必须在javascript代码中执行此操作

getElementById('div_register').setAttribute("style","font-size:20px");

通过这种方式你得到de div的id，并设置你想要的样式，你可以用这些设置不同的样式，并将代码空间保存为你想要的样式一个一个地声明...我希望我帮助你:-D

Answer 2

您可以使用style.fontSize属性使用javascript设置字体大小。代码看起来像

 document.getElementById("//id here").style.fontSize = "50px"; //size

查看示例here

Answer 3

借助javascript，您可以更改DOM属性。您可以创建一个外部div并为其指定一些名称/ ID。然后，循环遍历所有内部div并更新css样式属性。

     innerDivs = document.getElementById('odivID').getElementsByTagName('div');
     for (var i = innerDivs.length-1; i >= 0; i--) {
        innerDivs[i].style.fontSize = "25px";
     }

Answer 4

您可以通过多种方式执行此操作，但我建议使用类名：

<强>式

div.my-style {
  font-size:20px;
}

<强>脚本

...
var divs = document.getElementsByTagName('div');
var len = divs.length;
var cn;
if(len --) do {
  cn = divs[len].className;
  if(cn) {
    cn += ' my-style';//<-- spaces to separate with the existing class names, if any
  } else {
    cn = 'my-style';
  }
  divs[len].className = cn;
} while(len --);
...

注意：将样式应用于所有div也将应用于这些div，以及您不想要的同一页面。

Answer 5

您可以创建自己的css样式规则，覆盖默认值。

或者

使用javascript

<style>

<header>

或链接外部css文件<link>

请使用第一种方法查看小提琴：http://jsfiddle.net/b8Hn7/

var myStyle = document.createElement("style");
myStyle.innerText = 'div { font-size: 40px; }';
document.head.appendChild(myStyle);

上面的代码通过创建相同的规则来覆盖默认样式，但是在默认样式之后，不需要＆＃34;定位＆＃34;默认样式并更改它。

Answer 6

你可以尝试创造＆＃39;风格＆＃39;就像我的代码一样：

HTML：

</div>

JS：

var style = document.createElement('style');
style.innerText = 'div{width:100px;height:100px;border:1px solid #c4e;}';
document.body.appendChild(style);

如何使用Javascript覆盖元素的默认样式？

6 个答案: