Q&A
<script＞はどこに書いていますか？
「ボタン」を1回クリックすると，「1」と表示され，さらにもう1回クリックすると「2」と，クリックの回数が表示されるプログラムを記述したいのですが
.jsに記述すると
css
1 2var c = 0; //ボタンがクリックされた回数に関する変数 3function btnClick2(){//イベントハンドラ（関数）の定義 4 c = c + 1; //クリック回数を1プラス 5 var count = document.getElementById('count'); //countのIDを持つ要素を取得 6 count.textContent = c; //countのIDを持つ要素のテキストを書き換え 7} 8//clickイベントが起こった際のイベントハンドラの設定 9document.getElementById('btn2').onclick = btnClick2; 10 11document.getElementById('btn2').onclickの箇所に対して 12Cannot set property 'onclick' of nullと表示されます。
またHTMLファイルは
html
1 <!DOCTYPE html> 2<html lang="ja"> 3<head> 4<meta charset="utf8"> 5<title>プログラミング</title> 6<link rel="stylesheet" type="text/css" href="report.css"> 7<script src="report.js"></script> 8</head> 9<body> 10 11<div class="q"> 12<div class="q-head q-head2">プログラミング</div> 13<p class="question"> 14</p> 15<p class="q-body"> 16<button id="q2-btn">ボタン</button><br> 17表示：<span id="q2result"></span> 18<p id ="count"> 19</p> 20</div>
このようになっています。
すみません。
このようになっています。
<!DOCTYPE html>
<html lang="ja">
えっと、<script＞の位置はどこでしょうか？
すみません初心者なもので。
HTMLの一番初めに記述しております。
「HTMLの一番初め」と日本語で書かれても、いくつか考えられて曖昧です。
実際に<script>を含むコードの形で示していただければと思います。
失礼いたしました。
<!DOCTYPE html>
<html lang="ja">
<head>
<meta charset="utf8">
<title>プログラミング</title>
<link rel="stylesheet" type="text/css" href="report.css">
<script src="report.js"></script>
</head>
<body>
<div class="q">
<div class="q-head q-head2">プログラミング</div>
<p class="question">
</p>
<p class="q-body">
<button id="q2-btn">ボタン</button><br>
表示：<span id="q2result"></span>
<p id ="count">
</p>
</div>
このように記述しております。
質問は編集できるので質問本文にマークダウンのcode機能にてご提示ください。
m.ts10806さん
ありがとうございます。
（質問文は編集できます）質問文のHTML/JavaScriptはそれぞれコードブロックで囲んでいただけませんか？ ```（バッククオート3つ）で囲み、前後に改行をいれるか、コードを選択して「<code>」ボタンを押すとコードブロックになります。
回答2件
0
idが「btn2」のHTML要素が無いのでNULL
NULLにはonclickが設定できません
投稿2020/07/16 02:21
総合スコア116724
0
document.getElementById()は実行された時点のHTMLから、引数（質問文のコードなら'btn2'が引数）に渡したIDの要素を探すメソッドです。
提示されたコードは2つ問題が有りエラーが出ます。
0. yambejpさんの既に指摘されているHTML要素にid="btn2"がない問題
0. <script src="report.js"></script>がhead要素の中にあるので、まだHTMLが読み込まれていない問題
一つ目に付いてはq2-btnというidがついた要素があるのでdocument.getElementById('q2-btn')にすれば解決できるでしょう。
二つ目に付いてはscript要素をHTMLの最後（</body>の直前）に移動するか、「JavaScript onload」で検索して調べてみてください。
投稿2020/07/18 15:55
総合スコア69606
あなたの回答
tips
プレビュー
