javascript - 自分で削除できる要素を作成しますか？

Question

学校のプロジェクトとしてライトボックスを構築していますが、jQueryを使用できません。画像があります。クリックすると、JavascriptはID「overlay」で透過的なdivを作成します。divがそれ自体を削除するか、親がそれを削除するようにしたいのですが、機能しません。'onclick'をまだ存在しない要素にリンクできないという事実と関係があると思います。

Answer 1

親から要素を削除する必要があります。このようなもの：

d = document.getElementById('overlay');
d.parentNode.removeChild(d);

または、それを非表示にすることもできます。

d.style.display = 'none';

そして、ああ：onclick属性に関数を割り当てることで、（新しく作成された）要素にJavascriptコードを追加できます。

d = document.createElement('div');
d.onclick = function(e) { this.parentNode.removeChild(this) };

Answer 2

次のように要素を削除できます

var el = document.getElementById('div-02');
el.remove(); // Removes the div with the 'div-02' id

詳細はこちら

Answer 3

タグでハンドラーを使用しないでください。要素にイベントを動的に追加するonclickなどのJavascriptsイベント関数を使用してください。addEventListenerまた、要素を削除するときに、すべての参照を適切にクリーンアップすることを確認する必要があります（つまり、イベントハンドラーの登録を解除します）。

Answer 4

私はそれを持っています:)私はそれをバート悲しいようにやっていたが、それはうまくいきませんでした。私のコードは次のようになりました。

image.onclick = function(){ *create overlay*};
overlay.oncklick = function() {*overlay.parentNode.removeChild(overlay)*};

ブラウザはwtfのようになりますか？コードを読み取り、「ユーザーが存在しない要素をクリックしたかどうかを確認できない」と考えたためです。だから私はこれをしました：

image.onclick = function(){

*create overlay*

overlay.onclick = function() {*remove overlay*};
};