html - クリック時に選択した要素または DIV を非表示にする

Question

これに対する最も簡単な解決策を探していますが、うまくいかないようです!

いくつかの組み合わせを試しましたが、何もうまくいかないようです。これまでのところ、次のとおりです。

<div id="hideme" onclick="hideme();">HIDE THIS DIV</div>

<script>
function hideme(this) {
this.parentNode.parentNode.style.display = 'none';
}
</script>

さまざまなdiv IDを簡単に非表示にできるように、このようにしたい

Answer 1

onclickhtml 属性を使用してそれを行う方法は次のとおりです。

html:

<div id="hideme" onclick="hideme(this)">HIDE THIS DIV</div>

JavaScript:

function hideme(element) {
    element.style.display ="none";
};

jsFiddle _

---

これにはいくつかの方法がありますが、別の方法を次に示します。

html:

<div id="hideme">HIDE THIS DIV</div>

JavaScript:

document.getElementById("hideme").addEventListener("click",
    function() {
        this.style.display ="none";
    }, false
);

これがjsFiddleです

---

別の方法：

html:

<div id="hideme">HIDE THIS DIV</div>

JavaScript:

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

そしてそのためのjsFiddle。