2011-01-10 111 views
6

我想使用自动完成的代码。代码是here我应该在哪里放置我的JavaScript代码?

<script> 
    $(function() { 
     var availableTags = [ 
      "ActionScript", 
      "AppleScript", 
      "Asp", 
      "BASIC", 
      "C", 
      "C++", 
      "Clojure", 
      "COBOL", 
      "ColdFusion", 
      "Erlang", 
      "Fortran", 
      "Groovy", 
      "Haskell", 
      "Java", 
      "JavaScript", 
      "Lisp", 
      "Perl", 
      "PHP", 
      "Python", 
      "Ruby", 
      "Scala", 
      "Scheme" 
     ]; 
     $("#tags").autocomplete({ 
      source: availableTags 
     }); 
    }); 
    </script> 



<div class="demo"> 

<div class="ui-widget"> 
    <label for="tags">Tags: </label> 
    <input id="tags"> 
</div> 

</div><!-- End demo --> 



<div class="demo-description" style="display: none; "> 
<p>The Autocomplete widgets provides suggestions while you type into the field. Here the suggestions are tags for programming languages, give "ja" (for Java or JavaScript) a try.</p> 
<p>The datasource is a simple JavaScript array, provided to the widget using the source-option.</p> 
</div><!-- End demo-description --> 

但是,我不知道我应该把这个代码放在哪里。在头上?在身体?

回答

0

是的,你应该把它放在身体的元素。

0

如果可以的话,把它放在非常年底<body>元素后,你已经包括jQuery的自动完成插件本身,你依赖于任何其他库。在<body>末尾放置脚本通常(在撰写本文时:-)被认为是最佳实践,因为它允许浏览器在不必担心脚本执行之前进入标记。

3

根据w3schools

当把脚本HEAD

脚本的时候都 调用,或者当触发一个事件, 被放置在函数中执行。把你的 函数放在头部,这 它们都在同一个地方, 它们不会干扰页面 的内容。

当把脚本BODY

如果你不想你的脚本是 放在函数内部,或者如果你的 脚本应该写页面内容,它 应放置在身体部分。

所以在你的情况。你可以把这个脚本在body

+4

只是一个提示:在这里使用w3schools作为参考将导致大量的sn and和嘲笑。它不是权威的信息来源;它只是一个具有不同质量信息的随机网站。特别是,这个建议很奇怪,并不是很全面,甚至不准确。 – Pointy 2011-01-10 14:34:54

+0

好的。那么你在哪里建议寻找正确的信息?据我所知,http://www.w3.org/TR/html4/interact/scripts.html没有具体说明最佳做法。 – 2011-01-10 15:11:06

+0

这可能不是那种在真实规范中会出现的东西。这是一个关注好博客和在Stackoverflow等网站上阅读好答案的问题 - JavaScript性能(以及一般的客户端优化)近来是一个非常热门的话题,“最佳实践”观点迅速演变。 – Pointy 2011-01-10 15:22:03

2

把它放进外部文件,然后链接与HTML文档文件使用:

<head> 
    ... 
    <script type="text/javascript" src="/scripts/my-script.js"></script> 
</head> 

(如果你使用HTML5,你可以跳过type属性)。

上述方式是最清楚最常见的方式,但有些研究证明它并不是最快的方法。您可以在</body>元素之前放置该JavaScript,跳过jQuery.read()(在这种情况下为$(function() { ... });,这是简写形式)。在这种情况下,你会获得一些毫秒(或更少),但我只是觉得被迫注意到这一点。

相关问题