JavaScript

【JavaScript】文字色を変更してみる!【初級★】

JavaScriptを使うと、HTMLに動きを加えることができます。

今回は簡単な処理として、文字の色を変えるようなプログラムを作ってみようと思います。

目標

ブレインキャット

最終目標をしてはこんな感じにします。

ボタンを設置し押すと文字の色が変わります。

下のボタンを押してみてください!

文字色を変える!

作っていく!

HTML

ブレインキャット

1行目でtextというidを付けて文字を設定しています。

2行目でボタンを設置し,クリック時の処理を設定しています。

JavaScript

ブレインキャット

ボタンが押されたときの処理をJavaScriptで書きました。

document.getElementById(event)という部分で、eventに一致する要素を抜き出しています。

その要素にstyle.colorを引っ付けて色を変更しています。

まとめ

ブレインキャット

というわけでこんな感じとなります。うまく動いたでしょうか??

Webページが動くと面白いですよね!終わり!

ABOUT ME
ブレインキャット
本ブログのサブ管理人 関西でIT企業で働いているIT社畜 ラーメンと野球が好き

COMMENT

メールアドレスが公開されることはありません。 * が付いている欄は必須項目です