jquery - 使用 jQuery 编辑样式标签

Question

我正在尝试在样式标签中编辑一些样式。有没有办法从样式中获取特定的选择器来修改？例如，如果我有：

<style>
  h1 {
    background-color: red;
  }
</style>

我想将背景颜色更改为 #123456 有没有办法用 jquery 更改它？或者我必须编写一些函数来处理 $("style").text(); ?

Answer 1

只要页面在加载后没有更改，这将起作用：

$(function() {
  $("h1").css("background-color":"#123456");
});

如果您真的真的想编辑样式，那么可能是这样的：

$(function() {
  $("style").each(function(){
   $(this).html($(this).html().replace("background-color: red","background-color: #123456" );
  });

});

但这对我来说似乎是一个非常糟糕的主意。

Answer 2

您不使用 jQuery 来访问 CSS 定义，而是使用它来访问 DOM 元素并直接更改样式。

$('h1').css('background-color', '#123456');

http://api.jquery.com/css/

Answer 3

类似于在 jquery 中定义 css

$('h1').css('background-color', 'red');

您可以在需要的任何功能事件中对其进行变形。

就像准备好的文件一样

$(document).ready(function(){
  $('h1').css('background-color', 'red');
})

或者可能是其他一些自定义功能，如点击、悬停、选择等。

$(function() {
  $("h1").css("background-color":"red");
});