javascript - 获取 .js 文件中的脚本以加载到 HTML 中

标签 javascript css html

我用 javascript 编写了一个简单的版权脚本,我已经测试它可以正常工作:

<!DOCTYPE html>
<html>
<body>

<p id="footer"></p>
<script type = "text/javascript">

var initialYear = 2016;
var currentYear = new Date().getFullYear();
var yearYext = "null "

if (initialYear == currentYear)
{
	yearText = " " + initialYear + " ";
}

if (initialYear != currentYear)
{
	yearText = " " + initialYear + " - " + currentYear;
}

var copyright = {
    name : "Elliander Eldridge",
    symbol  : '\u00A9',
    year       : yearText,
};

document.getElementById("footer").innerHTML =
 "Copyright " + copyright.symbol + " " + copyright.year + " " + copyright.name 
 + ". All rights reserved.";

</script>


</body>
</html>

(从运行按钮可以看出)

所以我将脚本部分移到了 js/site.js(在网站文件的目录树中),并希望将其加载到所有页面的页脚中。

问题是既不使用这个:

<script src="../js/site.js"></script>

也不是这个:

<script src="../js/site.js">   
<p id="footer"></p>
</script>

什么都做,我似乎根本找不到加载它的方法。我也试过把它放在页面的其他部分但没有成功。我什至尝试将其放入每个页面都应该加载的 css 文件中。

附带说明一下,我希望能够从此文件加载多个脚本,类似于我在一个 css 文件中使用多个 css 类的方式,但不确定如何在此处执行此操作。

附言- 请不要建议我用 javascript 编写这个的替代方法。我只需要帮助来加载我已经编写的内容。

最佳答案

您的 js 代码在开始时被调用,甚至在加载 HTML 内容之前它会尝试查找 footer,这显然在页面上尚不存在。

一旦 DOM 准备就绪,即加载 HTML,您需要做的就是调用 js

<p id="footer"></p>
...
... 
// and at the end of the page
<script src="../js/site.js"> </script>

另一个可能有用的提示。把你的 js 代码放在这附近:

$(document).ready(function() { 
//put your code here
});

哦还有,这是不正确的

<script src="../js/site.js">   
<p id="footer"></p>
</script>

编辑:

因为你不想使用 jquery,所以这样做:

document.addEventListener('DOMContentLoaded', function() {
   // put your code here
}, false);

这确保 javascript 代码仅在加载 DOM 后运行

关于javascript - 获取 .js 文件中的脚本以加载到 HTML 中,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/35375656/

相关文章:

javascript - WebSQL | SQLite - 将 "?"字符插入数据库

html - 不同行的 Bootstrap Logo 和导航栏

html - CSS First Child Select,省略特殊类

html - Textarea 失去对鼠标单击的关注?

javascript - 在 jQuery scrollTo 中使用方向键

javascript - 使用 jQuery 附加多个 div 和图像以及其他标签的最佳方法是什么?

javascript - 通过与另一个数组进行比较来过滤 Angular 数组。

javascript - 将字符串数组转换为浮点型,然后求转换后数组的平均值

html - 图片、标题和文本对齐

javascript - 样式类的BackgroundImage对象没有被触发