function w3_open() { document.getElementById("mySidebar").style.display = "block"; document.getElementById("w3-button").style.display = "none" document.getElementById("w3-buttondos").style.display ="inline-block" } function w3_close() { document.getElementById("mySidebar").style.display = "none"; document.getElementById("w3-buttondos ").style.display = "none" document.getElementById("w3-button").style.display ="inline-block" } <button class="w3-button w3-teal" onclick="w3_open()">☰</button> <button class="w3-buttondos w3-teal" onclick="w3_close()">✖</button>me dice -> TypeError no detectado: document.getElementById (...) es nulo
document.getElementById no apunta a un nodo por su class="" sino por su id=""
<button id="w3-button" class="w3-button w3-teal" onclick="w3_open()">☰</button> Para apuntar a un elemento por su class , puede usar document.querySelector
document.querySelector(".w3-button")Si está utilizando document.getElementById() , debe declarar la propiedad id en el elemento html. Me gusta: id="w3-button"
function w3_open() { document.getElementById("mySidebar").style.display = "block"; document.getElementById("w3-button").style.display = "none" document.getElementById("w3-buttondos").style.display ="inline-block" } function w3_close() { document.getElementById("mySidebar").style.display = "none"; document.getElementById("w3-buttondos").style.display = "none" document.getElementById("w3-button").style.display ="inline-block" } <button id="w3-button" class="w3-button w3-teal" onclick="w3_open()" hidden>☰</button> <button id="w3-buttondos" class="w3-buttondos w3-teal" onclick="w3_close()">✖</button> <div id="mySidebar"> My Sidebar </div>