この記事では、Webページの背景とフォントの色を変更するJavaScriptメソッドについて説明します。参照のためにそれを共有してください。特定の分析は次のとおりです。
JavaScript、ボタンをクリックしてWebページの背景とフォントの色を変更します。 Webページの色を変更するNボタンがあります。異なるボタンをクリックすると、Webページのフォントと背景が異なる色に変わります。非常にシンプルなJavaScriptアプレット。
1。基本的な目的
Webページを開くとすぐに、最初に挨拶メッセージ「Hello」を促します。
Webページの色を変更するNボタンがあります。ここで、返品はWebページのデフォルト色で、背景は白で、フォントは黒です。
別のボタンをクリックすると、Webページのフォントと背景が異なる色に変更されます。
私はもともと虹の改善をしたかったのですが、原則はまったく同じであるため、これ以上のボタンを書くことはありません。
2。基本的なアイデア
重要なのは、ボディータグとフォントJSにIDを提供して、JSで制御できるようにすることです。この例は、JS関数へのアプリケーションを提供します。
3。生産プロセス
単純な小さなページ、詳細についてはコメントをご覧ください。
次のようにコードをコピーします。
<html xmlns = "http://www.w3.org/1999/xhtml">
<head>
<Meta http-equiv = "content-type" content = "text /html; charset = gb2312" />
<title> js変更背景色</title>
<！ - この段落はJSファイルに分離することもできますが、このコードは短すぎるため、必要ありません - >
<script type = "text/javascript">
//オンロードはこのWebページのコンストラクターと同等であり、OnunloadはこのWebページの分離関数と同等です
function load（）{
アラート（ "Hello！"）;
}
function unload（）{
アラート（「さようなら！」）;
}
関数changecolor（bcolor、fcolor）{
//フォントのフォントの色の変更に相当<span style = "色：渡されたfcolor">
document.getElementById（ "body"）。style.background = bcolor;
document.getElementById（ "ziti"）。style.color = fcolor;
}
</script>
</head>
<！ - 重要なのは、Webページ全体とラインフォントにIDを提供することです。 JSのgetElementByID（）メソッドは、CSSの物事を簡単に制御できます - >
<body onload = "load（）" onunload = "unload（）" id = "body">
<span id = "ziti"> js </span>
<br />
<！ - パラメーターを二重引用符で渡すと、元の二重引用符が単一の引用符になることに注意してください。 OnClickの値は、このボタンがクリックされるとトリガーされるものです - >
<入力onclick = "changecolor（ '＃ff0000'、 '＃ffffff'）" type = "ボタン"
value = "red" />
<入力onclick = "changecolor（ '＃ff9900'、 '＃ffffff'）" type = "ボタン"
value = "orange" />
<入力onclick = "changecolor（ '＃ffff00'、 '＃000000'）" type = "ボタン"
value = "Yellow" />
...
<入力onclick = "changecolor（ '＃ffffff'、 '＃000000'）" type = "ボタン"
value = "return" />
</body>
</html>
onunload（）関数は、IEがこのページを閉じる場合にのみほぼ有効です。このダイアログボックスはフロントエンドになく、Google Chromeは効果がありません。したがって、この関数にはほとんど意味がありません。
JSカラーオペレーションスキルに興味がある友人は、オンラインツールを参照することもできます。
RGBカラーエンコーディングジェネレーター
オンラインWebカラーマッチングツール
RGBカラークエリ比較テーブル_colorコードテーブル_colour英語名コレクション
この記事がみんなのJavaScriptプログラミングに役立つことを願っています。