Question

我的第二个.js文件有一个函数

function createRectangle(x, y, w, h){
    this.x = x;
    this.y = y;
    this.w = w;
    this.h = h;

    ctx.fillRect(x, y, w, h);
}

但是我想从我的第一个.js文件中调用这个函数我该怎么做？

Answer 1

确保您的网页在first.js之前包含second.js

a in

<script src="second.js"></script>
<script src="first.js"></script>

现在在 first.js 中，您可以调用 second.js中定义的createRectangle函数

Answer 2

包含的顺序并不重要。执行顺序确实如此。假设我们有一个javascript文件：

function a() { b(); }
function b() { alert("hello!"); }
window.onload = a;

那会有用。函数a出现在代码中的函数b之前，但重要的是执行顺序。由于我实际上没有调用函数a或b直到window.onload，这确保浏览器有机会在运行任何内容之前加载所有内容。

在onload（或document.ready）之前推迟运行JS是一个好主意，因为这样可以确保加载所有代码，包括HTML。如果你在html dom准备好/加载之前尝试获取一个元素，那么它也会失败。

Answer 3

只要在second.js完全加载后在first.js中调用该函数，两个脚本的包含顺序就无关紧要了。

PS：仅供参考，在浏览器解析DOM之后，html页面中包含的脚本最终会出现在公共空间/范围内（因此，可以调用其他.js文件中的函数）。在您的情况下，如果某些其他.js文件定义了与您的名称相同的函数，则定义此类函数可能会出现问题。在这种情况下，您的功能将被覆盖。设计模式和代码结构的研究肯定会帮助你解决这些问题。

Answer 4

在 first.js 文件中将 second.js 文件添加到一个页面中。换句话说，两者都应该包含在页面中，在调用函数之后尝试。

，例如，

<script src="yourpath/second.js"></script>
<script src="yourpath/first.js"></script>

在另一个.js文件中使用.js文件中的函数

4 个答案: