1つのものだけで動作するはずのクリックはすべて影響を受けます

Question

クリックしたときに消えるはずの円を作ったのですが、何らかの理由でそれをクリックすると画面上のすべてが消えてしまいます。画面上の他のものは、すべてが消えてしまいます。ここにサークルのコードがあります（divを円にするCSSはありません）。完全なコードはリンクにあります。

<div id="circle"> <div> 

---

document.getElementById("circle").onclick = function() { 
      document.getElementById("circle").style.display="none"; 
     } 

https://jsfiddle.net/Dovid_M/51smpyeq/#&togetherjs=gAo0i0hlSt

Answer 1

あなたのJSFiddleのすべては、id="circle"のdiv内にあります。あなたが</div>の終了時に/が見つからなかったためです。

無効なHTMLをレンダリングするのではなく、ブラウザでエラーが発生した場合は、すぐに問題が見つかるはずです。

Answer 2

あなたが正しくdivタグを閉じていなかったからです。

<div id="circle"> </div>ではなく、<div id="circle"> <div>です。

終了タグに/を入れなかったため、Javascriptはタグが決して終了していないと思って、それが<div id="circle">の一部でもあると思っただけです。