- ベストアンサー
JavaScriptでdivのボタンを作成する方法
- JavaScriptを使用してdivのボタンを作成する方法について調べました。
- jQueryを使用せずにdivのボタンを作成する方法について試してみましたが、うまくいきませんでした。
- 具体的なコード例を示したHTMLファイルも添付しました。
- dkong
- お礼率86% (170/197)
- JavaScript
- 回答数2
- ありがとう数2
- みんなの回答 （2）
- 専門家の回答
質問者が選んだベストアンサー
やり方は前の方が示したとおりですが、どうしてうまく動かなかったのか説明します。 document.getElementsByTagName("div").onclick = function(){ ～略～ } を分解して前半分を見てみます。 document.getElementsByTagName("div") は「html要素」ではなく「html要素を値として保持する配列」です。 したがって document.getElementsByTagName("div").onclick = という記述は配列にonclick属性を付加する記述になりますが、当然のことながら無意味な記述（エラーになるかどうかは処理系次第）です。 配列の中身である各要素にそれぞれonclick属性を付加しなくては動きません。
その他の回答 (1)
- t_ohta
- ベストアンサー率38% (5241/13712)
<!doctype html> <html> <head> <meta charset="UTF-8"> <title>無題ドキュメント</title> </head> <body> <div id="aaa" class="div_link">a</div> <div id="bbb" class="div_link">b</div> <div id="ccc" class="div_link">c</div> <div id="ddd" class="div_link">d</div> <div id="eee" class="div_link">e</div> <script> function clickTag (){ var x = this.id; alert(x); } var divtags = document.getElementsByTagName("div"); for(var i=0; i<divtags.length; i++) { divtags[i].addEventListener("click", clickTag); } </script> </body> </html>
お礼
ありがとうございました。コードを書いていただき、参考になりました。
お礼
詳しい解説ありがとうございました。とても勉強になりました。