Question

我刚刚开始使用Javascript，我试图将我的脚本放在一个单独的文件中。当他们在html文件中时，它们工作得很好，但是一旦我将它们移动到他们自己的单独文件中，它就会停止工作。

这是我的html文件：

    <!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 is just a 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 the light bulb to turn it on or off.</p>

</body>
</html>

这是我的js档案：

    <script>
function changeText(){
    var string_first = "This is just a test.";
    var string_second = "Woah, it actually 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>

Answer 1

<script>代码是html内容，而不是javascript，因此您不需要（并且无法）在外部文件中使用它们。你使用的是什么浏览器？许多都有一个内置的控制台，可以帮助您查看您的页面发生的错误（如果有的话）。

单独文件中的Javascript无法正常工作

1 个答案: