なぜこれは動作しませんか？ onclick属性を変更する

Question

速く、おそらくあなたにとって解決しやすい問題です。

function openNav() { 
    document.getElementById("myNav").style.visibility = "visible"; 
    document.getElementById("myNav").style.opacity = "1"; 
    document.getElementById("nav-icon3").attribute("onclick","closeNav()"); 
} 

この機能は、視認性と不透明度は問題なく機能しますが、オンクリック機能の変更は機能しません。何か案は？ Page：http://test.advermedia.pl/

Answer 1

この属性を設定する必要があります。以下で試してみてください：

document.getElementById("nav-icon3").setAttribute("onclick", "closeNav()"); 

Answer 2

まず、それはsetAttribute()、ないattribute()です。第二に、それは、イベント属性を使用するときには、実行時にそれらを動的に変更するのではなく、とにかく本当に悪い考えです。代わりに、単一の控えめなイベントハンドラを使用します。

<div id="nav-icon3">Toggle nav</div> 

document.getElementById("nav-icon3").addEventListener('click', function() { 
    var nav = document.getElementById("myNav"); 
    nav.style.visibility = nav.style.visibility == 'visible' ? 'hidden' : 'visible'; 
    nav.style.opacity = nav.style.opacity == '1' ? '0' : '1'; 
}); 

または代わりに、あなたはjQueryのをタグ付けしましたとおり

$('#nav-icon3').click(function() { 
    $('#myNav').toggle(); 
});