Question

这个问题与其他一些PHP＆amp;以前在这里问过的Javascript问题，至少不是我能找到的问题。

我有一个.php文件，其中包含一些HTML元素，这些元素由PHP为了参数而呈现，我们会说文件位于http://url.php。它正在寻找某些GET标签，并且如果存在这些get标签则包括div。

<?php if(isset($_GET['VAR']))
{
   echo '<div id="VARDIV"></div>';
}?>

当然我意识到这一切都发生在服务器上，并被发送回javascript接管的客户端Web浏览器。

但是在javascript中（在同一个PHP页面上）我有以下代码在页面加载时执行，寻找div标签并用它做一些事情：

if(document.getElementById("VARDIV")!==null)
{
     alert('div exists!');
}

当网页加载时，如果网址http://url.php?VAR正确，则逻辑上会弹出div吗？

但事实并非如此。如果我在控制台中第二次运行javascript代码它工作正常，所以它不是拼写错误（例如getElementsById或类似的东西）。

这怎么可能像这样失序？ PHP引擎是否应该呈现HTML，然后在执行一行JS之前将其传递回浏览器？

根据以下评论编辑清晰度：

<script type="text/javascript">
    function doDIVStuff()
    {
       if(document.getElementById("VARDIV")!==null)
       {
        alert('div exists!');
       }
    }
doDIVStuff();
</script>

<html>
   <body>
      <?php if(isset($_GET['VAR']))
      {
      echo '<div id="VARDIV"></div>';
      }?>
   </body>
</html>

Answer 1

使用window.onload（）或document.onload（），查看差异here

你也可以将你的脚本放在html标签结尾之前，尽管IE中的某些内容可能会产生意想不到的后果，见here

Answer 2

尝试使用jquery和文档就绪事件：

$(document).ready(function(){
     if(document.getElementById("VARDIV")!==null)
     {
        alert('div exists!');
     }
})

如果您不想包含jquery js lib，可以在此处使用解决方案：

pure JavaScript equivalent to jQuery's $.ready() how to call a function when the page/dom is ready for it

Answer 3

实际上如果你把javascript代码放在文件末尾的所有php和html代码之后它必须工作。我已经测试了它。

<?php if(isset($_GET['VAR']))
{
   echo '<div id="VARDIV">Dilip</div>';
}?>

<script type="text/javascript">
    if(document.getElementById("VARDIV")!==null)
{
     alert('div exists!');
}
</script>

但我认为最好使用onload事件

window.onload=function(){if(document.getElementById("VARDIV")!==null)
    {
         alert('div exists!');
    }};

或者，如果你可以使用jquery，那就太棒了..

$(document).ready(function(){
     if(document.getElementById("VARDIV")!==null)
     {
        alert('div exists!');
     }
})

Answer 4

任何不在函数内部的JavaScript都会在解释页面时按顺序执行。你的doDIVStuff（）;在页面上解释任何HTML之前调用正在执行，因此您的＆＃34; VARDIV＆＃34;在DOM中尚未提供供JS阅读的内容。

正如其他人所建议的那样，最好的方法是在页面加载完成后监听，然后触发对函数的调用。

Answer 5

包装doc rdy（）或者只做这样的事情：

<html>
<head>

</head>
<body>
<?php if(isset($_GET['VAR']))
{
  echo '<div id="VARDIV"></div>';
}?>
<script type="text/javascript">
  function doDIVStuff()
  {
    if(document.getElementById("VARDIV")!==null)
    {
      console.log('div exists!');
    }
  }
  doDIVStuff();
</script>
</body>

</html>

Answer 6

我会说你应该创建一个javascript文件并将你的代码放在那里，以便你可以调试它。

javascript在浏览器完成呈现页面之前执行

6 个答案: