JavaScript

イベント

・イベント処理…あるイベントが発生したときに実行する処理。例えばスクロールすれば背景画像が変わる、マウスをクリックすれば画面が変わるなど。・イベントリスナー…イベント処理を行う際に使用する関数イベントターゲット要素.addEventListener("イベントタイプ", function() { 指定したイベントタイプが発生した際におこなわれる処理}); 上の構文の具体例として「OKボタンをクリックしたときにインストールを実行する」というコードを作成す

DOM（HTML）②

HTMLのタグをJavaScriptで追加する方法 appendChild()メソッドを使用する。例えば<ｐ>タグを追加したい場合、<body>の子要素に<h1><dl><p>を置くと考えると var element = document.createElement("p"); //タグ生成var text = document.createTextNode("hello"); //テキスト生成document.body.appendChild(element)

DOM（CSS）

JavaScriptでCSSの変更を行う。例えば<dd class="weather" style="color: #ff7c89;">晴れ</dd>というHTML上でCSSを記述したものがあるとする(この場合テキストがピンクになる) これをJavaScriptで記述するには var element = document.querySelector(".weather"); //クラス名の前には"."を忘れずにelement.style.color = "#ff7c

DOM(HTML)

DOM…documentオブジェクトのことこれを操作することで HTMLの変更や追加がJavaScriptで行える。 HTMLでidを指定したときはgetElementById()メソッド、class属性・セレクタで指定した要素はquerySelector()メソッドで要素取得する。 ※class属性はclass名の前に「.(ドット)」をつける。 DOMのツリー構造を考えると取得したい要素を指定できる。 <h1>JavaScript</h1><dl> <d

windowオブジェクト

オブジェクト…値や変数、関数をまとめて１つのグループにしたもの。例： var student = {gender: "male", //←プロパティ2：値2age: 18,　　　　　//←プロパティ2：値2major: "arts"　　//←プロパティ2：値2}; これでstudentオブジェクトに情報をまとめることができる。「gender: "male"」をプロパティという。それに対してオブジェクトに設定されている関数をメソッドという。例： var

onloadイベント

onload ="関数；" …ロードが完了したときに実行する処理を設定するための属性。頁をロードすると処理されるので、これにより<script>のなかに書かなくていい。見やすく書きやすくなるようだ。

textContent

textContentとはそのタグ内に書かれているテキストのコンテンツのこと。<p>タグのようにテキストの書かれたタグのオブジェクトに使用するとそのテキストを取り出すことができる。さらに『(関数).textContent = '新しいテキスト';』でテキストの書き換えができる！！

getElementByid

・document.getElementByid('関数'); ……documentオブジェクトにある『getElementByid』というメソッド。・getElementByidとは「idを指定して、そのドキュメント内にあるエレメントを取り出す」・エレメントは「HTMLで書いたタグのこと」ととりあえず考えておく。つまり「id='msg'」のタグのオブジェクトを取り出すということ。

2021/4/5 コンストラクタ関数

コンストラクタ関数…オブジェクトを作るための関数。 function 関数名 (引数) { …………実行する処理………… } これを作ることによって、いつでも必要なときに関数を呼び出すだけで、処理が実行できる。 ※引数…関数を呼び出すときに渡す値。変数名。カンマで複数OK。コンストラクタ関数にはオブジェクトの中に用意できる『プロパティ』と『メソッド』を作っておく。プロパティ…this.プロパティ名 = 値; メソッド … this.メソッド名 = f

フォローしませんか？

#関数