document.getElementByID是外部还是内联？

Question

我一直在尝试使用document.getElementByID从外部JS文件中提取HTML文件中的信息,但它似乎不起作用.是否document.getElementByID只有工作,如果它是内嵌在HTML文件或可以在一个外部JS文件正常工作？正确地在HTML文档中调用JS文件,因为其他功能正在运行.

Answer 1

document.getElementByID是否仅在与HTML文件内联时才有效

没有.

它可以在外部JS文件上正常工作吗？

是.

你可能document.getElementById()在DOM准备好之前调用了.

Answer 2

首先,确保你正在使用document.getElementById("xxx"),而不是document.getElementByID("xxx")(注意最后的大写差异).你的问题指的是document.getElementByID("xxx")这可能是问题所在.

其次,您必须确保在浏览器解析了相关DOM项之后执行该函数.如果你要放入document.getElementById一个在<head>部分中加载的外部JS文件并在加载后立即执行,那么DOM还没有准备好.

你有几个选择:

1)将外部JS文件<script>标记放在正文的末尾,就在</body>标记之前.这不仅可以更快地加载/显示页面,而且可以保证在JS文件可以运行之前解析DOM.

<body>
Your HTML here

<script type="text/javascript" src="myscript.js"></script>
</body>

2)由于你有jQuery,把你刚才执行的代码放在一个$(document).ready(fn)块中,这样jQuery就会阻止执行直到DOM准备就绪.如果你这样做,那么你可以把你的代码放在任何地方(<head>如果你愿意,可以在你的部分中).

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

3)将代码放在任何你想要的地方,但没有任何代码立即执行.相反,将所有初始化代码放在一个初始化函数中(让我们称之为myPageInit()你调用它:

$(document).ready(myPageInit);

4)将代码放在任何你想要的地方,但不要立即执行任何代码.相反,将所有初始化代码放在一个初始化函数中(让我们称之为myPageInit()你在</body>标记之前从脚本调用它:

<script type="text/javascript">myPageInit()</script>