如何在HTML中使用外部.js文件中的变量？

Question

我已经编写了一个函数，该函数根据浏览器语言填充URL（包含图像）。 然后将该后续URL写入变量。 所有图像均基于语言，因此对于德国来说，它将是“ de.gif”，法国将是“ fr.gif”，依此类推。

我的问题是如何在HTML页面中调用此变量？

为了帮助我更好地说明此问题，此处是JavaScript，请注意，这是此HTML页面的调用的EXTERNAL .js文件：

function IABEU_moused_detect() {
(function IAB_lang_detect() {"use strict";
var IAB_lang_map = {"de-at": "at","nl-be": "be-nl","fr-be": "be-fr","da": "den","de": "de","hu": "hu","en-ie": "ie","ga": "ie","es": "es","fr": "fr","it": "it","nl": "nl","no": "nor","pl": "pl","en": "uk","en-GB": "uk","en-US": "uk","en-gb": "uk","en-us": "uk"},
IAB_lang = (navigator && navigator.browserLanguage) || (window.navigator && window.navigator.language) || "en-GB";
IAB_url = ("http://www.someurl.com/" + IAB_lang_map[IAB_lang]);
IAB_img = ("http://www.myimagesarehere.com/" + IAB_lang_map[IAB_lang]+".gif");
}());}

因此，这是我要在HTML页面中调用的IAB_img变量（这是.js文件中的全局变量）

HTML在这里：

<div>
  <img src="HERE IS WHERE I WANT TO call the variable 'IAB_img'"> 
</div>

谢谢

编辑：所以我仍然不能解决这个问题，有没有办法让我使用“ IAB_img”中的值作为HTML文件中的图像src？

Answer 1

我将从给图像一个ID开始。

<div>
    <img id="TheImage" src="HERE IS WHERE I WANT TO call the variable 'IAB_img'"> 
</div>

然后在您的JavaScript函数中，只需分配图像的src，如下所示：

function IABEU_moused_detect() {
    (function IAB_lang_detect() {"use strict";
        var IAB_lang_map = {"de-at": "at","nl-be": "be-nl","fr-be": "be-fr","da": "den","de": "de","hu": "hu","en-ie": "ie","ga": "ie","es": "es","fr": "fr","it": "it","nl": "nl","no": "nor","pl": "pl","en": "uk","en-GB": "uk","en-US": "uk","en-gb": "uk","en-us": "uk"},
        IAB_lang = (navigator && navigator.browserLanguage) || (window.navigator &&   window.navigator.language) || "en-GB";
        IAB_url = ("http://www.someurl.com/" + IAB_lang_map[IAB_lang]);
        IAB_img = ("http://www.myimagesarehere.com/" + IAB_lang_map[IAB_lang]+".gif");
        var image = document.getElementById('TheImage');
        image.src = IAB_img;
}());}

Answer 2

您是否通过模板呈现html页面？ 如果是这样，您可以包括一个带有可变设置的javascript代码段，以供进一步阅读：

<script type="text/javascript">
  var IAB_img = {{value}};
</script>

只需在加载其他脚本之前将其放入，即可为您定义IAB_img。

Answer 3

像这样：

<div>
 <img src="javascript:document.write(IAB_img);" />
</div>