Question

我有一个带有简单函数的JS文件，匹配div的宽度\高度。如何使用HTML文件中的属性调用此函数。

换句话说，我想在外部文件中编写一个函数matchHeight（div1，div2），但是可以使用我想要的div从任何地方调用它。

该功能存在，我只是不知道如何以我想要的方式调用它。

很抱歉，如果我没有清楚地解释自己。

感谢。

Answer 1

如果您在MatchHeights(d1,d2){ ... }文件中编写JS功能，并将HTML页面中的文件链接起来，就像通常链接任何JS文件一样，那么您可以拨打电话只要在浏览器加载链接文件后调用该函数，就可以在页面的任何部分使用function。

事实上，你甚至可以在其他JS文件中调用它，只要原始包含文件被浏览器加载到其他文件之外。

要让function在页面加载时运行，请在function标记的onload事件中调用body：

<script type="text/javascript">
var div1 = (some code to get the element)
var div2 = (some code to get the element)
</script>
...
...
<body onload="matchHeight(div1,div2)">

Answer 2

您必须链接.html文件中的.js文件，如下所示：

<head>
 <script src="yourJSFile.js" type="text/javascript"></script>
</head>
<body onLoad="yourFunction();">
</body>

Answer 3

您可以应用的jQuery中一个非常常见的模式是传入CSS选择器。如果您只能传入div的ID，这是最简单的，但其他解决方案也可以。

首先从init字符串中取出任何参数。这是复杂的方式。试试这个：

<body onload="init()">

function init() {
  matchHeight("id1", "id2");
}

一旦你有了这样的功能，就可以得到这些函数中的实际div：

function matchHeight(id1, id2) {
  var div1 = document.getElementById(id1)
  var div2 = document.getElementById(id2)
  // .. other stuff
}

如果您正在使用jQuery，我建议您完全简化此操作，将init()函数完全取下body标签，将其替换为jquery(document).load(function() {并使用普通的CSS选择器代替.. .. matchHeight("#id1", "#id2")和var $div1 = $(id1);，但无论哪种方式都有效：）

使用另一个文件中的属性调用JS函数

3 个答案: