javascript - 如何使用 javascript 或 jquery 更改 html 元素的 css 属性

Question

我怎样才能CSS从javascript.

我正在使用jQuery-ui Dialog并且我想DIV从 javascript 更改 a 的样式。

谢谢

Answer 1

查看jQuery 文档。如果你想要什么，它就会在那里。

总之，如果你想给元素添加样式，你需要使用这个css函数，它有几个变种。

$(selector).css(properties);  // option 1
$(selector).css(name, value); // option 2

所以如果你有一个 ID 为“mydiv”的 DIV 并且你想让背景变成红色，你会这样做

$("div#mydiv").css({'background-color' : 'red'}); // option 1
$("div#mydiv").css('background-color','red');     // option 2

如果您一次设置多个东西，第一种方法会更容易。

如果要检查当前设置的属性，可以使用第二个选项的变体，只需省略该值。

var color = $("div#mydiv").css('background-color');

例如，如果您已经在上面设置了它，则将使 varcolor成为。red

您还可以添加和删除类，执行类似的操作

$(selector).addClass(class_name);
$(selector).removeClass(class_name);

Answer 2

即使没有 jQuery，这个答案也有效。

所以你有这样的事情：

<style type="text/css">
    .foo { color: Red; }
    .bar { color: Blue; }
</style>
<div class="foo" id="redtext"> some red text here </div>

如果您只想更改某些属性，您始终可以使用

var div = document.getElementById('redtext');

功能，然后通过更改附加的颜色样式

div.style.color = 'Green';

使您的红色文本显示为绿色。

如果要将为 div 定义的类更改为另一个样式类，可以执行以下操作：

div.className = 'bar';

使 div 现在使用类栏，这会使您以前的绿色文本变为蓝色。

Answer 3

有几种方法可以使用 jQuery 框架来操作元素样式。查看与 CSS 和更改属性相关的文档：

• http://docs.jquery.com/Attributes/addClass#class
• http://docs.jquery.com/CSS

Answer 4

试试这个。这是 jquery 代码。

 $("myDiv").css({"color":"red","display":"block"})

如果你使用 vanila javacript，试试这个。

var myDiv = document,getElementById("myDiv");

myDiv.style.display = "block";

myDiv.style.color = "red";