Fatal编程技术网

何时何地将javascript放入html

javascript

何时何地将javascript放入html,javascript,Javascript,我不熟悉Java脚本。我在练习代码。当我把代码放在头部分时，我得到元素null，当我把它放在主体内，但在元素之前，我也得到null，但如果我把它放在主体内，但在元素之后，我得到元素。我想问为什么在前两种情况下我会变为空。这是我的密码 <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"> <html> <head> <title></title&g

我不熟悉Java脚本。我在练习代码。当我把代码放在头部分时，我得到元素null，当我把它放在主体内，但在元素之前，我也得到null，但如果我把它放在主体内，但在元素之后，我得到元素。我想问为什么在前两种情况下我会变为空。这是我的密码

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
    <head>
        <title></title>
        <meta http-equiv="Content-Type" content="text/html; charset=UTF-8">

        <script type="text/javascript" src="js/attributes.js"></script>   // null

    </head>
    <body>

        <script type="text/javascript" src="js/attributes.js"></script>  // null
        <a id="braingialink"
           onclick="return showAttributes();"
           href="http://www.braingia.org" >Steve Suehring's Web Site
        </a>

        <script type="text/javascript" src="js/attributes.js"></script>   // ok

</body>
同时告诉我，放置

在a元素之后，与我在script标记中编写脚本相同，如

<a href="http://www.braingia.org" id="braingialink">Steve Suehring's Web Site</a>
<script type="text/javascript">
    var a1 = document.getElementById("braingialink");
    alert(a1.getAttribute("href"));
    a1.setAttribute("href","http://www.microsoft.com");
    alert(a1.getAttribute("href"));
</script>


var a1=document.getElementById（“braingialink”）；
警报（a1.getAttribute（“href”）；
a1.setAttribute（“href”http://www.microsoft.com");
警报（a1.getAttribute（“href”）；
这两件事的意思是一样的吗

谢谢

最好就在结束正文标记之前，不要干扰页面加载和呈现！它也被谷歌推荐，例如分析片段和facebook

由于DOM尚未加载，您的头部将变为null—您的对象当时不存在。使用以下命令：

window.onload = function () {
    // Your code
}
哦，还要看看jQuery的
.ready（）
函数。这对以后的头痛肯定会有帮助。

通常，您应该将脚本块放在
head
标记中。如果您有特殊原因（例如，由于脚本来自速度较慢的服务器，因此需要稍后加载脚本），可以将它们放在
body
标记中

无法访问该元素的原因是，代码在浏览器解析该元素的代码之前运行，因此该元素根本不存在

您可以使用
load
事件在加载文档后运行代码：

window.onload = function() {

  // here you put the code that needs to access the elements

}
由于脚本在浏览器仍在加载页面时执行，因此会得到空值。由于页面可能尚未呈现所有元素，因此会得到空值。您需要在页面加载完成后运行脚本。
将脚本放入HEAD元素，并在body的
onload
事件中调用它。

您需要了解web浏览器如何将资源加载到页面中。Firefox->Firebug插件网络选项卡显示资源加载的时间线。如果您正在使用jQuery或类似的东西（而且您不需要这样做），那么将代码粘贴到
$（document）.ready（function（）{..}
）中，这将确保页面已完全加载

另外，在
标记之前加入自定义js也是一个很好的做法，这样页面DOM就可以加载了

如果您想更深入地了解这一点，请阅读： 及

请参见和

您可以在文档中放置无限数量的脚本，并且可以同时在正文和标题部分中放置脚本。 通常的做法是将所有功能放在页眉部分或页面底部。这样，它们都位于一个位置，不会干扰页面内容

浏览器从上到下解析文档，如果遇到
块（无论是内联脚本还是包含外部JS文件）它在解析更多文档之前运行JavaScript。如果特定代码块试图引用任何元素，它只能访问源代码中位于其上方的元素，即已解析的元素

document.getElementById（）
方法返回
null
，如果没有为您提供的id找到元素，那么如果您试图使用它来访问源代码中它下面的元素，它们还没有被解析并且找不到

处理这一问题最常见的两种做法是：

  • 将所有脚本放在
    的底部，这样当它运行时，所有元素都将被解析

  • 创建一个“onload”处理程序，即定义一个函数，该函数将在文档加载完成后立即运行。您可以从
    中的脚本块执行此操作-定义onload函数的JavaScript将立即运行，但稍后在加载完所有内容后执行该函数

    • 以下是执行选项2的最简单方法：

    window.onload = function() {
   var x = document.getElementById("x");
   // other element manipulation here
};

    在同一个文档中没有任何事情阻止你做1和2，同时在文档的中间抛出一些<代码> <代码>块，但是大多数人发现把所有代码放在一个位置是更合适的。

    当你使用WOWDO.OnLoad时，这会在运行脚本之前等待所有的元素被加载，还是在页面是L时运行？加载？？是的，它将等待所有内容加载。请参阅此页面：因此，当我们在标题部分或正文标记之后使用脚本时？这意味着，如果您想访问HTML中的任何元素，最好在结束正文标记之前使用脚本，正如Jannis M所建议的。是的，我认为这也应该有效，但只是为了安全确定这一点通常是很好的做法。此外，随着js越来越长，您可能希望js在单个文件中。只需在
    窗口内调用自定义
    init
    函数即可。onload
    即已设置。没有“应该”关于这一点，您可以肯定，将代码放在末尾将与使用onload一样有效。请注意，您可以从外部JS文件内部设置
    window.onload=…
    ，因此您也不需要
    init
    函数。如果您担心有多个外部JS文件，那么所有这些文件都需要使用
    onload
    然后使用
    .addEventListener（）
    /
    .attachEvent（）
    以便可以附加多个（独立的）处理程序。当我们使用
    $（document）.ready（function（）{..}
    时，元素及其属性也可用，或者只有元素可用。例如，如果我有
    ，那么当
    $（document）.ready（fn）
    运行，那么我也可以访问的所有属性？或者我只是有没有属性的元素？您已经有了属性，我想问一下何时使用
    。这与我们编写
    window.on相同吗

    window.onload = function() {
   var x = document.getElementById("x");
   // other element manipulation here
};