ホームページ  >  記事  >  ウェブフロントエンド  >  JavaScriptでCSSを変更する方法

JavaScriptでCSSを変更する方法

藏色散人
藏色散人オリジナル
2021-04-12 16:17:222806ブラウズ

JavaScript で CSS を変更する方法: 最初に新しい HTML ファイルを作成し、p タグを使用してテキスト行を作成します。次に、クラスを通じて p タグのスタイルを設定し、次に button タグを使用してボタン; そして最後に「changeColor()」を使用します。この関数を使用して CSS スタイルを変更できます。

JavaScriptでCSSを変更する方法

この記事の動作環境: Windows7 システム、javascript1.8.5&&HTML5&&CSS3 バージョン、Dell G3 コンピューター。

test.html という名前の新しい HTML ファイルを作成して、JavaScript が指定された CSS スタイルをどのように変更するかを説明します。

JavaScriptでCSSを変更する方法

test.html ファイルで、p タグを使用してテキスト行を作成し、そのクラスを myid に設定し、id 属性を test に設定します。

JavaScriptでCSSを変更する方法

css タグで、クラスを通じて p タグのスタイルを設定し、その色を赤、テキスト サイズを 20px として定義します。

JavaScriptでCSSを変更する方法

test.html ファイルで、button タグを使用してボタンを作成し、onclick クリック イベントをボタン ボタンにバインドします。をクリックし、changeColor()関数を実行します。

JavaScriptでCSSを変更する方法

js タグ内に、changeColor() 関数を作成します。関数内で、ID を通じて p タグ オブジェクトを取得し、color 属性値を変更してテキストを変更します。スタイルやカラーで。

JavaScriptでCSSを変更する方法

test.html ファイルをブラウザで開き、ボタンをクリックして効果を確認します。

JavaScriptでCSSを変更する方法

【推奨学習: JavaScript 上級チュートリアル #】

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

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