Question

这里是新手。这里有2个几乎相同的html。顶部的一个工作，底部的工作不是出于某种原因（从主体到头部移动了2 <script>列）。为什么<script>中<head>的所有<!DOCTYPE HTML> <html> <head> <script type="text/javascript" src="jquery.js"></script> <link rel="stylesheet" href="fancybox.css" type="text/css" media="screen" /> </head> <body> <div id="center"> <a class="fancybox" href="imagelarge.jpg"><img src="image.jpg" alt="" /></a> </div> <script type="text/javascript" src="jquery.fancybox.pack.js"></script> <script type="text/javascript"> $(document).ready(function() { $(".fancybox").fancybox(); }); </script> </body> </html>都不起作用？这个有效：

<!DOCTYPE HTML>
<html>
 <head>
  <script type="text/javascript" src="jquery.js"></script>
  <link rel="stylesheet" href="fancybox.css" type="text/css" media="screen" />
  <script type="text/javascript" src="jquery.fancybox.pack.js"></script>
  <script type="text/javascript">
    $(document).ready(function() {
        $(".fancybox").fancybox();
    });
</script>
</head>

<body>
   <div id="center">
    <a class="fancybox" href="imagelarge.jpg"><img src="image.jpg" alt="" /></a>
     </div>
    </body>
</html>

这个没有：

{{1}}

Answer 1

首先，脚本include可以始终位于标题

中

<head>
  <script type="text/javascript" src="jquery.js"></script>
  <link rel="stylesheet" href="fancybox.css" type="text/css" media="screen" />
  <script type="text/javascript" src="jquery.fancybox.pack.js"></script>
</head>

现在.. fancapps他们自己把onload部分直接放在他们想要添加fancybox的图像下面。所以这可能有一个原因 - 至少对于他们的演示页面 - 但我认为应该可以删除document.ready部分并给它一个镜头。

<script>
$(function(){
    $(".fancybox").fancybox();
});</script>

所以你最终得到：

<head>
  <script type="text/javascript" src="jquery.js"></script>
  <link rel="stylesheet" href="fancybox.css" type="text/css" media="screen" />
  <script type="text/javascript" src="jquery.fancybox.pack.js"></script>
  <script>
    $(function(){
      $(".fancybox").fancybox();
    });
  </script>
</head>

如果我是正确的，这稍微改变了执行的顺序，在页面不仅完全加载但也完全解析之后将调用该函数，以便在将fancybox类分配给img-link之后调用fancybox

Answer 2

两个版本之间没有区别，除了底部代码在jquery.fancybox.pack.js之前不包含jquery.js脚本标记。一切都会有效。

当<script>从body移动到head？</script>时，为什么不加载脚本？

2 个答案: