How do YOU(specifically, you) watch for variable changes in your script? #javscript #AllOtherCodeToo
<!-- This is like a challenge, and a question, and just me trying to talk out a problem I'm having. Well, currently it's not a PROBLEM. But I don't think it is technically "Best Practices" and mightcould qualify as some light hacking... lol Using a similar system to what I write here to detect HP and MP in my HTML5 game, and keep the bars filled at the proper level. Let's say: My style classes are as follows. --> <style> b { display: none } i { display: inline } </style> <!-- Here's some HTML to interact with it.--> <body> <header>Header</header> <!--/* Becomes the footer */--> <i>Information</i><b>Paragraph</b> <button onClick="switchItUp()">Switch it up</button> <!-- My script says --> <script> var x = "inline" var y = "none" function switchItUp() { document.getElementsByTagName("b")[0].style.display = x; document.getElementsByTagName("i")[0].style.display = y; y = document.getElementsByTagName("b")[0].style.display; x = document.getElementsByTagName("i")[0].style.display; } function getHeaderFooterSwitch() { if (document.getElementsByTagName("i")[0].style.display === "none") { document.getElementsByTagName("header")[0].style = "position:absolute; bottom: 0px; padding-left:80%;" } else { document.getElementsByTagName("header")[0].style = "position:absolute; top: 0px; padding-left:80%;" } } setInterval(getHeaderFooterSwitch, 30) //<----------- Here's My Issue </script> <!-- So, it works. But the issue is, I know that calling a function every couple milliseconds isn't exactly the best method. This is just a simple example, there are plenty of more complicated ways a code like this could be used. //Commented for simple CnP to Code Playground. ------------------------BOTTOM LINE----------------- What's a better/the BEST way to watch for variable changes? And how do YOU do this? -->