Question

我正在开发一个网络应用，我正面临一个问题。问题是，我有多个页面，我已链接到一个外部JavaScript文件。例如，我有page1.html, page2.html and page3.html，所有这些我都添加了外部JavaScript文件script.js。问题是，我的一些javascript是全局的，因为它在页面加载时直接加载，而不像函数一样调用。在这个脚本中，我引用了一些来自page1.html的DOM元素，但是当我访问page2.html时，我在控制台中遇到错误，这是因为page1.html的DOM仍然被{{1}访问有什么办法，我从一个script.js文件加载每个页面的特定部分脚本，或者只是从每个页面的script.js文件加载脚本的相关部分。

此外，我已经看到外部JavaScript链接在很多地方都喜欢这个：

https://www.careem.com/sites/all/themes/careem/js/splash.js?p2g189

您可以注意到在使用script.js ？符号和某些数字后，是否可以帮助我？

Answer 1

如果HTML文档来自同一来源，您可以查看.pathname的{{1}}

location

如果您尝试在同一来源的不同浏览上下文中访问变量，则可以使用// global variables for all pages here const g = "global"; if (location.pathname.indexOf("page1.html") > -1) { // do stuff } if (location.pathname.indexOf("page2.html") > -1) { // do stuff } if (location.pathname.indexOf("page3.html") > -1) { // do stuff }或localStorage在浏览上下文之间进行通信（如果或当加载了多个文档时）。

Answer 2

是的，您可以创建一些模仿“编译器指令”的内容，如下所示：

例如，您可以选择 document.location 或 document.title 来确定哪个页面已加载，因此您可以在脚本中使用...

var Page=document.location;


if (Page.indexOf('page1')>-1) {

 // JS instructions for page 1

} else 

if (Page.indexOf('page2')>-1) {

 // JS instructions for page 2

} else 

if (Page.indexOf('page3')>-1) {

 // JS instructions for page 3

}

等等......

Answer 3

我可以看到两种解决方案。

使用<script> code here </script>（或添加辅助外部脚本）将文档特定代码移出全局脚本并将其放入HTML内联文件中。

或者您可以为自己的网页添加标识符，例如<body id="page1">，并根据id有条件地运行代码。

if (document.getElementById("page1")) {
  // code specific to page1.html
}

相同的外部JavaScript链接到许多文件

3 个答案: