Jas*_*210 5 html javascript getelementbyid
（不使用 JQuery）
为了正确地提出这个问题，我做了一个简单的例子，一个网站包含三个页面A、B和C。每个页面都链接到一个JavaScript文件。JavaScript文件链接在body标签的底部。以下是其中一个 html 页面的示例：
<html>
<head>
<title>Page A</title>
<link rel="stylesheet"
type="text/css"
href="temp.css">
</link>
</head>
<body>
<h1 id = "headingA">Page A</h1>
<button id="enterA">Enter</button>
<script src = temp.js>
</script>
</body>
</html>
除了“A”明显替换“B”和“C”之外，这三个页面看起来都很相似。
//this button is on page A
var btnA = document.getElementById("enterA");
btnA.onclick = function () {
"use strict";
window.console.log("Button A Pressed");
window.open("/pageB.html", "_self");
};
//this button is on page B
var btnB = document.getElementById("enterB");
btnB.onclick = function () {
"use strict";
window.console.log("Button B Pressed");
window.open("/pageC.html", "_self");
};
//this button is on page C
var btnC = document.getElementById("enterC");
btnC.onclick = function () {
"use strict";
window.console.log("Button C Pressed");
window.alert("Button C Pressed");
};
显然这是行不通的，因为一次只能加载一个页面，因此脚本试图在未加载的页面上抓取的元素将导致脚本错误。
我可以想出几种方法来解决这个问题，但我觉得自己像个黑客，我在这里问的原因是为了寻求最佳实践解决方案，因为我相信这一定是实践开发人员的第二天性（不像我自己）。
没有理由将特定于某一页面的 JavaScript 存在于跨所有页面加载的 .js 文件中。事实上，这有潜在的风险，因为如果引入同名的元素，可能会出现不明确和意外的行为。您可以（并且通常会在重要的项目中）在每一页加载多个 JavaScript 文件，因此虽然有很多方法可以构建您的代码，但我认为这是一种常见的做法：
将共享的、非特定于页面的 JavaScript 保存在一个文件中，例如
然后为每个页面创建一个特定于页面的 JavaScript 文件：
像现在一样，在所有页面上加载 Common.js 文件，但在每个页面上，另外加载包含该页面特定功能的脚本文件。正如评论中提到的，您还可以编写 JavaScript 来检查有问题的元素是否存在并采取相应的行动，但我鼓励您开始在代码组织方面形成更好的习惯，并完全避免问题。
| 归档时间： |
|
| 查看次数： |
2812 次 |
| 最近记录： |