ホームページ >ウェブフロントエンド >jsチュートリアル >JavaScriptで背景色を変更する方法

JavaScriptで背景色を変更する方法

醉折花枝作酒筹
醉折花枝作酒筹オリジナル
2021-06-15 10:45:393813ブラウズ

JavaScript では、style オブジェクト属性を使用して背景色を変更できます。構文形式は「element object.style.background="color value"」です。 Style オブジェクトは単一のスタイル宣言を表し、スタイルが適用されるドキュメントまたは要素からアクセスできます。

JavaScriptで背景色を変更する方法

このチュートリアルの動作環境: Windows7 システム、JavaScript バージョン 1.8.5、Dell G3 コンピューター。

<html>
  <head></head>
  <body>
    <ul id="ul1">
      <li></li>
      <li></li>
      <li></li>
      <li class="box"></li>
      <li></li>
      <li class="box"></li>
      <li class="box"></li>
      <li></li>
      <li></li>
      <li></li>
    </ul>
  </body>
</html>
<script>
  window.onload = function () {
    //获取名字ul1的ID
    var oUl = document.getElementById("ul1");
    //获取li标签
    var aLi = oUl.getElementsByTagName("li");
    //循环li
    for (var i = 0; i < aLi.length; i++) {
      //判断li标签名字为className为box
      if (aLi[i].className == "box") {
        //给li标签加背景色
        aLi[i].style.background = "red";
      }
    }
  };
</script>

[推奨学習: JavaScript 上級チュートリアル]

以上がJavaScriptで背景色を変更する方法の詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。

声明:
この記事の内容はネチズンが自主的に寄稿したものであり、著作権は原著者に帰属します。このサイトは、それに相当する法的責任を負いません。盗作または侵害の疑いのあるコンテンツを見つけた場合は、admin@php.cn までご連絡ください。