htmlとjavascriptについて
こんばんは。
そしてお久しぶりです。
GW中盤?になってようやく自分の時間が取れたので今日はようやく進捗が!
予定よりだいぶ遅れていますが、GWはそんなもんですね。
元々ほとんど予定は入れていませんでしたが急に予定が入ったりします。
さて、今日1日でやったことは
hello
スタイルを変更してみましょう
暗号を入れてください
パスワードは「モメチャンカワイイヤッターです。」
覚えたことについて
IDを引っ張ってきて色々通知したりHTML書き換えたりするやつ
document.getElementById().onclick = function(){}
このドキュメントでID指定されているものを引っ張ってきて指定のものがクリックされたとき(onclick) {}内の処理を行う。
今回はalertとinnnerHTML=""を使って通知を出した後、HTMLの内容を変更するようにしました。
また、クリックで指定したIDのテキストカラーを変えられるようにもしました。
バックグラウンドカラーを指定したボックスの角を変更する
バックグラウンドを100pxX100pxに指定して正方形のバックグラウンドカラーを作ります。
そしてその半径を50%にしてあげるとなんと丸くなります。
このように記載⇒ border-radius: 50%;
そして先ほど使ったonclickでボタンをクリックすると円のdisplayをnoneにする処理を書き込みます。
forでHTMLを繰り返し書き換える
今回は["morning","lunch time","dinner time","Good night","もめだよ"]で配列を用意して
配列内のデータをparagraphで囲って繰り返し表示されるようにしました。
パスワード入力欄について
inputフォームを用意したら
onclickでの処理を記入。{
document.getElementById("フォームのID").value;
これでフォーム内のデータを引っ張ってくることができるので
別に用意した変数passWordEnteredにフォーム内のデータを代入
if(フォーム内=用意してたパスワード)
Trueなら承認に成功しましたと表示
それ以外なら暗号が違いますと表示
}
するようにしました。
これが使えるようになるとID,PW認証ができるようになります。
作ったデータはこちらです。
PS.明日はVRC大規模オフ会当日!! スタッフ頑張ります✨