9

重複の可能性:
実行時に CSS クラス定義を変更/削除する方法は?

外部CSSファイルを使用するHTMLページがあります。実行時にjavascriptを使用して外部ファイルのCSSルールを変更したいです。

myHtml.html

<html>
  <head>
    <link rel="stylesheet" href="myCSS.css" type="text/css">
    <script type="text/ecmascript" src="myJS.js" />
  </head>
  <body>
    <p> change css style color for this element using javascript </p>
  </body>
</html>

myCSS.css

.p{ color:blue}

myJS.js

var ss = document.styleSheets[0]
var firstRule = ss.rules[0] // null

操作を実行したい:

firstRule.style.color = "red" ;
4

2 に答える 2

2

内部 css を使用して、外部 css プロパティをオーバーライドできます。また、次の 3 つの方法で実現することもできます。

1）たとえば、コードに従って「スタイル」タグを含め、間にプロパティを書き込むように、ページ自体でcssプロパティを宣言します

< html>

 < head>
   < link rel="stylesheet" href="myCSS.css" type="text/css">
   < script type="text/ecmascript" src="myJS.js" />
   <style type="text/css">
   ........................
   .........................
   </style>
< /head>
< p > change css style color for this element using javascript   
< /p>

< /html>

2) インライン CSS の使用

< p style="font-color:red;"> change css style color for this element using javascript   
< /p>

3) javascript の使用: これは単なる別の方法であり、内部 CSS 実装の実装を達成するための間接的な方法と言えます。@Misamによる最初の回答を参照してください

于 2012-07-16T07:05:58.737 に答える
0

次の方法で達成できます

var div = document.getElementById("newDiv");
div.style.position = "absolute"; 
div.style.top = "200px"; 
div.style.left = "200px";

同様に、さらに CSS プロパティを編集/追加できます。これが CSS ルールの変更に役立つかどうかを確認してください: CSS ルールの変更

于 2012-07-16T06:28:53.010 に答える