antiguo (Hola y gracias de antemano, me gustaría hacer un botón con modo oscuro y si hace clic en él, se convierte en modo oscuro y el botón se llama modo blanco, luego, cuando hace clic en él nuevamente, se convierte en modo blanco y el botón se llama modo oscuro de nuevo.)
nuevo (ahora falta el estilo de cambio de botón al hacer clic en él)
function myFunction() { var element = document.page; element.classList.toggle("dark-mode"); } <html> <head> <style> .page { padding: 25px; background-color: white; color: black; font-size: 25px; } .dark-mode { background-color: black; color: white; } </style> </head> <body> <div class="page">Hello</div> <button onclick="myFunction()">dark mode</button> </body> </html>No creo que document.page sea js válido. asignar la clase al cuerpo
document.getElementsByTagName('button')[0].textContent='dark-mode'; function myFunction() { var element = document.getElementsByTagName('body')[0]; element.classList.toggle("dark-mode"); var button = document.getElementsByTagName('button')[0]; if(button.textContent == 'dark-mode')button.textContent='white-mode'; else button.textContent='dark-mode'; } <html> <head> <style> .page { padding: 25px; background-color: white; color: black; font-size: 25px; } .dark-mode { background-color: black; color: white; } </style> </head> <body> <div class="page">Hello</div> <button onclick="myFunction()"></button> </body> </html>