html - Javascript in separate file not working -
i'm starting out in javascript, , i'm trying put scripts in separate file. work fine when they're in html file, move them own separate file stops working.
here's html file:
<!doctype html> <head> <meta lang = "en"> <link rel="stylesheet" type="text/css" href="css/mainstyle.css"> <script src="js/script1.js"></script> <title>web dev practice</title> </head> <body> <h1>first javascript example</h1> <button type="button" onclick="changetext()">clickme!</button> <p id="demo">this test.</p> </br> </br> <h1>second javascript example</h1> <img id="lightbulb" onclick="changeimage()" src="res/img/pic_bulboff.gif" width="100" height="180"> <p>click light bulb turn on or off.</p> </body> </html>
and here's js file:
<script> function changetext(){ var string_first = "this test."; var string_second = "woah, works!"; if(document.getelementbyid("demo").innerhtml == string_first){ document.getelementbyid("demo").innerhtml = string_second; } else{ document.getelementbyid("demo").innerhtml = string_first; } }
<script> function changeimage(){ var image = document.getelementbyid('lightbulb'); if(image.src.match("bulbon")){ image.src = "res/img/pic_bulboff.gif"; } else{ image.src = "res/img/pic_bulbon.gif"; } } </script>
the <script>
tags html things, not javascript, don't need (and can't have) them in external files. browser using? many have built in console can see errors, if any, page throwing.
Comments
Post a Comment