个人中心
gpt4 book ai didi

javascript - HTML 文件找不到外部 javascript 函数

转载 作者：行者123 更新时间：2023-12-05 08:45:34 27 4
gpt4 key购买 nike

我有一个基本的 html 文件:

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
</head>
<body>
    <script type="module" src="test2.js"></script>
    
    <p>
    <button onclick="myMove()">Click Me</button>
    </p>

    <div id ='myContainer'>
    <div id ='myAnimation'></div>
    </div>
    
</body>
</html>

该文件引用了一个名为“test2.js”的外部 javascript 文件，并尝试在单击按钮时使用一个名为“myMove()”的函数。

javascript 文件及其函数“myMove()”如下所示:

import './style.css'


function myMove(){
    var elem = document.getElementById('myAnimation');
    var pos = 0;
    clearInterval(id);
    id = setInterval(frame,10);
    function frame() {
      if (pos == 350){
        clearInterval(id);
      } else {
        pos++;
        elem.style.top = pos +'px';
        elem.style.left = pos + 'px';
      }
    }
  }

将函数直接嵌入到 html 文件中时，效果很好。但如上图所示，尝试从外部调用时，浏览器控制台报错:

test2.html:20 Uncaught ReferenceError: myMove is not defined
    at HTMLButtonElement.onclick (test2.html:20:32)

为什么 html 文件找不到 javascript 函数，我该怎么做才能解决这个问题？

补充说明:网络选项卡显示加载文件没有错误。此外，当我从 javascript 中删除“import '/style.css'”时，它会影响页面的显示，这表明它正在被访问。

谢谢

最佳答案

一个澄清的问题，是否加载了外部 javascript 文件？您可以从网络选项卡下的浏览器开发人员工具(通常是 Windows 中的 Ctrl+Shift+i)进行检查。确保在加载 test2.js 时没有显示 404 或任何其他错误

enter image description here

关于javascript - HTML 文件找不到外部 javascript 函数，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/72297939/

27 4 0
文章推荐： awk 计算指定字符出现次数，未找到则返回 0
文章推荐： javascript - 使用javascript定位h1中每个单词的首字母
文章推荐： r - 如何按包含特殊符号 R 的名称对列进行排序
文章推荐： python - 尝试多次尝试，但如果其中一次失败(最后)则引发错误
行者123
个人简介

我是一名优秀的程序员,十分优秀！

滴滴打车优惠券免费领取
滴滴打车优惠券
全站热门文章
Copyright 2021 - 2024 cfsdn All Rights Reserved 蜀ICP备2022000587号
广告合作:1813099741@qq.com 6ren.com