精华内容
下载资源
问答
  • 一、js文件应当放在哪个目录下 Java编程中建立的web工程,js文件只要在WebContent路径下即可正常编译,如果是规范的项目开发,应该是在WebContent目录下创建一个js目录,之后将对应的js文件放到此路径下,便于统一...

    一、js文件应当放在哪个目录下
    Java编程中建立的web工程,js文件只要在WebContent路径下即可正常编译,如果是规范的项目开发,应该是在WebContent目录下创建一个js目录,之后将对应的js文件放到此路径下,便于统一管理(但不是必须的),根据实际需要存放到对应的jsp文件路径下也是可以的。
    在这里插入图片描述
    同理,ccs和html文件只要放在WebContent下即可。

    二、如何创建一个.js文件?
    eclipse里面怎样创建一个js文件,点击file – new – others—输入javascript 然后选择下面的javascript source file 输入名字 ,点击finish 就能新建js文件了

    展开全文
  • JS文件应该放在什么位置

    千次阅读 2019-07-04 20:40:51
    我们今天来聊一聊关于JavaScript文件的引入位置的问题;大家在平时的Web开发中有没有想过这样一个问题,那就是我应该在文档的头部(也就是<head>标签内部里面)引入所需要的JavaScript文件还是应该在尾部(也...

    我们今天来聊一聊关于JavaScript文件的引入位置的问题;大家在平时的Web开发中有没有想过这样一个问题,那就是我应该在文档的头部(也就是<head>标签内部里面)引入所需要的JavaScript文件还是应该在尾部(也就是</body>之前)引入所需要的JavaScript文件呢?今天我们就来深入的探究一下这个问题。

    首先我们需要了解的一点就是,在浏览器渲染页面之前,它需要通过解析HTML标记然后构建DOM树。在这个过程中,如果解析器遇到了一个脚本(script),它就会停下来,并且执行这个脚本,然后才会继续解析HTML。如果遇到了一个引用外部资源的脚本(script),它就必须停下来等待这个脚本资源的下载,而这个行为会导致一个或者多个的网络往返,并且会延迟页面的首次渲染时间。

    还有一点是需要我们注意的,那就是外部引入的脚本(script)会阻塞浏览器的并行下载,HTTP/1.1规范表明,浏览器在每个主机下并行下载的组件不超过两个(也就是说,浏览器一次只能够同时从同一个服务器加载两个脚本);如果你网站的图片是通过多个服务器提供的,那么按道理来说,你的网站可以一次并行下载多张图片。但是,当我们网站在加载脚本的时候;浏览器不会再启动任何其它的下载,即使这些组件来自不同的服务器。

    看到这里,也许很多开发者都会想:既然把脚本(script)资源放在head里面是个不好的主意,并且可能会阻塞浏览器渲染页面;那我们是不是要把所有的JavaScript文件都放置到文档的底部呢?这个当然也是太过极端了,因为还是有一些情况需要我们在头部引用脚本的;到底是哪些情况需要我们这么做呢,下面我们来看看一些大公司的做法:

    我们可以看到,这个搜索页面在头部加载了5个JavaScript文件(箭头标注的地方),其中两个JavaScript文件是内联的(inline),另外三个大家可以看到script标签上都添加了async属性,那这个属性是干嘛的呢?我们会在下面解释。

    我们可以看到,百度也在头部引入了一些JavaScript文件,这些文件引入的方式与Google的做法差不多,都在引入外部资源的script标签上添加了async属性,除了第一个JavaScript文件没有那样做。

    最后一个是facebook的首页,令我比较出乎意料的是,facebook的首页的头部引入了大量的脚本(script),大家可以看一下截图

    不过基本上facebook的script标签上面都添加了async属性,下面我们先来来说一下script标签上面这个async属性的作用。

    这个属性是HTML5给script新添加的属性,而且只适用于外部的JavaScript文件,如果在script标签上添加了这个属性,那么表明这个脚本资源就不再是同步加载的了,而是异步加载的,所以不会阻塞浏览器对页面的渲染。当然这个属性会存在一些兼容性问题,一些浏览器还未实现对这个属性的支持。

    我们可以看到,虽然这些网站大部分的script标签(针对引入的外部文件)都添加了async属性,但是还是有一些script标签没有添加async属性,那就表示这些资源是同步加载执行的,在这里你可能会问,那这些资源为什么不使用异步加载呢?原因很大程度上是因为,这些脚本需要在浏览器渲染页面之前就执行的;比如Yahoo在Best Practices for Speeding Up Your Web Site中就指出,如果你的脚本中使用了document.write在页面中插入内容的话,那就不能够将这条脚本放置到文档的底部了。类似的还有weibo,weibo的head中也使用了一个要在页面渲染之前就执行的脚本,如下:

    <script type="text/javascript">
        try {document.execCommand("BackgroundImageCache", false, true);
            } catch (e) {}
    </script>
    

    还有百度首页的head中也有两条需要在页面渲染之前就执行的JavaScript文件:

    <script data-compress="strip">
    function h(obj){
        obj.style.behavior='url(#default#homepage)';
        var a = obj.setHomePage('//www.baidu.com/');
    }
    </script>
    <script>window._ASYNC_START=new Date().getTime();</script>
    

    还有一些比如Google和Baidu他们搜索页面同步加载的那些JavaScrip文件一些是为了在页面渲染之前做一些全局的处理(比如Google)添加了全局变量google。

    还有的就是单纯的满足自己业务上的一些需求了,比如百度同步加载的那个JavaScript文件:

    所以说,除了上面这些情况外,其它的情况下我们的脚本资源都需要放在文档的底部;当然这里还有一些需要我们注意的问题,首先,脚本加载的顺序很重要,比如如果你的脚本需要使用jQuery库,那么你就应该在加载你的脚本之前先加载jQuery库。其次,有些脚本是需要等到某些元素加载完成之后才可以执行的,那么你可以将你的脚本紧挨在那个元素的后面;还有一些元素是通过脚本动态创建的,所以它们也需要放在合适的位置。比如微博的:

    如果使用过一些框架的脚手架你就会发现,这些框架打包后的那个index.html里面引入的外部JavaScript资源都是放在文档的底部的,并且它们也是按照顺序来的,vendor.js文件(项目使用的框架,库打包形成的文件)先引入,然后才是app.js文件(我们写的代码文件打包形成的),这就说明了引入脚本文件的顺序也是很重要的。

    到现在为止,我们已经讨论了很多关于把JavaScript文件放在文档的头部还是尾部的原因,那么下面我们可以总结出一些加载JavaScript文件的最佳实践;

    • 对于必须要在DOM加载之前运行的JavaScript脚本,我们需要把这些脚本放置在页面的head中,而不是通过外部引用的方式,因为外部的引用增加了网络的请求次数;并且我们要确保内敛的这些JavaScript脚本是很小的,最好是压缩过的,并且执行的速度很快,不会造成浏览器渲染的阻塞。

    • 对于支持使用script标签的async和defer属性的浏览器,我们可以使用这两个属性;其中需要注意的点就是,async表示的意思是异步加载JavaScript文件,它的下载过程可以在HTML的解析过程中进行,加载完成之后立即执行这个文件的代码,执行文件代码的过程中会阻塞HTML的解析,它不保证文件加载的顺序。defer表示的意思是在HTML文档解析之后在执行加载完成的JavaScript文件,JavaScript文件的下载过程可以在HTML的解析过程中进行,它是按照script标签的先后顺序来加载文件的。更多详细的解释可以参考async vs defer attributes

    展开全文
  • 关于js文件应该放在头部还是尾部

    千次阅读 2018-05-15 15:01:13
    网页文件的读取是从上到下的,如果将JavaScript文件放置在head当中,会先加载JS文件,之后再继续执行,那么此时,如果JS文件比较大,页面加载就会很慢,导致空白。其实,如果将JS文件放置在底部的话,可以让JS文件与...

    具体将引入的JS放在哪里与代码执行的顺序有关。网页文件的读取是从上到下的,如果将JavaScript文件放置在head当中,会先加载JS文件,之后再继续执行,那么此时,如果JS文件比较大,页面加载就会很慢,导致空白。

    其实,如果将JS文件放置在底部的话,可以让JS文件与图片几乎同时下载,使得页面当中的内容能够尽快的下载下来,但是,由于网页基本结构与样式均已经加载完成,那么此时负责交互的JS并没有下载下来,必然也会对用户的体验造成影响。

    因此,整体来说,如果“交互性优先”,那么我们应当将JS放置在顶部。如果对于交互性要求没那么高的页面,我们将JS放置在底部。


    展开全文
  • css文件js文件应当放在页面哪里

    千次阅读 2019-09-17 23:51:32
    css文件放在页面的头部 why? <link rel="stylesheet" href="home.css"> link标签里面的href(HyperText reference)属性表示超文本引用,当CSS使用href引用,浏览器会识别该文档为CSS,并行下载,不会...

    前提:问的是性能优化 ?

    css文件放在页面的头部
    why?

    <link rel="stylesheet" href="home.css">
    

    link标签里面的href(HyperText reference)属性表示超文本引用,当CSS使用href引用,浏览器会识别该文档为CSS,并行下载,不会停止对当前文档的加载,在加载html生成DOM tree的时候,就可以同时对DOM tree进行渲染,这样可以防止闪跳,白屏或者布局混乱

    js文件放在body的闭合标签之前
    why?

    <script src="home.js"></script>
    

    src(source)资源,是页面必不可少的一部分,当script使用src引用,浏览器解析到该元素时会停止对文档的渲染,直到该资源加载完成。这也是将script放底部而不是头部的原因。加载js文件会停止对dom的创建,而且js加载完会立即执行,同时会阻塞后面资源的加载

    追问:我现在就是要把js文件放在头部,怎么处理?
    当浏览器解析到script标签时,默认会先先下载js文件下载完了就执行,脚本的执行时同步和阻塞的,为了解决阻塞的问题,script标签新增了两个布尔属性,分别是defer(延迟)和async(异步)

    <script src="home.js" defer></script>
    <script src="home.js" async></script>
    

    当使用defer时,js和html并行下载,不会阻塞dom树的创建,当dom树创建完成时才会执行js
    当使用async时,js和html并行下载,当下载完会立即执行js,执行期间会阻塞html的解析
    三种模式对比

    展开全文
  • head 部分中的脚本: 需调用才执行的脚本或事件触发执行的脚本放在HTML的head部分中。当你把脚本放在head部分中时,可以保证脚本在任何调用之前被加载。 body 部分中的脚本: 当页面被加载时执行的脚本放在HTML的b...
  • 在一个JS文件中引用另一个JS文件 方法一 在调用文件的顶部加入下例代码: document.write(””); (注:有时你引用的文件还可能需要引用其他的js,我们需要将需要的那个js文件也以同样的方法引用进来) 方法二 通过...
  • js文件应该放在头部还是尾部?

    千次阅读 2016-10-16 17:02:02
    首先在HTML文件js脚本是按顺序加载的。 假设你的js脚本是给页面上某个元素绑定了事件,如果你将js脚本放在尾部就会造成页面出来了,但是js脚本没加载出来的这段时间里对绑定事件了的元素进行操作是没有效果的。...
  • 把外部JavaScript文件放在HTML底部

    千次阅读 2013-11-28 15:06:36
    本文档整理大部分公认的、或者少有争议的JavaScript良好书写规范(Best Practice)。...把外部JavaScript文件放在HTML底部   我们的目标是相同的:为用户尽可能快地显示内容。当载入一个脚本文件的时候,HTML会
  • 我们今天来聊一聊关于JavaScript文件的引入位置的问题;大家在平时的Web开发中有没有想过这样一个问题,那就是我应该在文档的头部(也就是标签内部里面)引入所需要的JavaScript文件还是应该在尾部(也就是之前)...
  • 该把JS文件放在HTML文档的那个位置

    万次阅读 2017-06-08 19:39:47
    大家在平时的Web开发中有没有想过这样一个问题,那就是我应该在文档的头部(也就是标签内部里面)引入所需要的JavaScript文件还是应该在尾部(也就是之前)引入所需要的JavaScript文件呢?今天我们就来深入的探究...
  • 作者:钢盅郭子 ... 来源:知乎 著作权归作者所有,转载请联系作者获得...JS和CSS在页面中的位置,会影响到其他资源(指img等非js和css资源)的加载顺序,究其原因,有三个值得注意的点: JS 的执行有可能依赖
  • 1、放在标签之间如果想让脚本在某些事件上运行,例如,当用户单击某处时,则可以将该脚本放在头部,如下所示...例如,This is web page body 3、放在和标签之间可以将JavaScript代码完全放在和部分中,如下所示,4、...
  • 由于浏览器按照[removed]在网页中出现的顺序,读取Javascript文件,然后立即运行,导致在多个文件互相依赖的情况下,依赖性最小的文件必须放在最前面,依赖性最大的文件必须放在最后面,否则代码会报错。 (2)性能...
  • 有些JS为什么不可以单独放在一个js文件里面  分享| 2012-08-07 16:43583922227 | 浏览 1428 次  Javascript编程语言 function slide(types,id,nums,class1,class2) { for(i=1;i;i++) { document...
  • js shell 运行javascript文件

    千次阅读 2017-07-18 22:40:03
    js shell的使用
  • 之前用EasyUI做了两个页面,js代码放到了文件里,在head里引入js文件。 但是页面一直出不来,只能放到body的底部,页面才能出来。 后来在js文件了加了一个函数,$(document).ready(function(){} 把页面初始化部分...
  • 主要介绍了一个Js文件函数中调用另一个Js文件函数的方法,两个javascript文件中相互调用函数,主要是将引入的Js文件代码放在</body>下面。具体操作方法可查看下文,需要的朋友可以参考下
  • js文件中获取另外一个js文件的变量值 例如: 一个地址好几个js文件都会...这里新建一个http.js文件(我们使用的地址放在在这个文件中) 代码如图: 需要引用这个api变量的文件result.js的代码内容(此时result...
  • 在web-lib下的文件引用js文件的时候,路径还是相对于webroot来说的,所以不能和当前文件的路径作为比对,应该以webroot作为该文件的当前路径,比如一个jsp文件在web-inf的jsp文件夹下,当引用js文件的时候,应该
  • js文件中引用其他js文件

    万次阅读 2016-04-08 13:25:34
    在a.js中需要用到b.js中的方法,所以需要在a.js中引用b.js文件js不提供类似java中import的导包语句所以只能添加元素到html文档,方法如下: 在a.js文件中写 方法一: document.write(""); 方法二:
  • JavaScript入门 JavaScript是一种轻量级、解释型的Web开发语言,该语言系统不是很庞杂,简单易学。由于所有现代浏览器都已经嵌入了JavaScript引擎,JavaScript源代码可以再浏览器中直接被解释执行,用户不用担心支持...
  • javascript文件中读取properties文件需要的插件jquery.i18n.properties-min-1.0.9.js
  • vim-jsbeautify-v1.1.3-2018-01-31 描述 ... 然后下载的zip文件,并将其内容放在~/.vim/plugin/lib/ ,即: wget https://github.com/beautify-web/js-beautify/archive/v1.8.9.zip && unzip v1.8.
  • MVC 项目放在虚拟目录下 如果用虚拟路径的话,经常会出现找不到 文件或是图片的情况。   下面介绍一些方法处理这种情况   Url.Content 例如:   " />">   或者是   把虚拟目录名称写到配置...
  • 别人给我写好了后台,但是我吧js文件和css文件放在别人的后台项目目录里面发现读取不到,无奈我只能吧js文件和css文件放在服务器里面,然后通过域名访问,js文件和css文件访问是没有问题的,但是我引入一个字体图标...
  • 在工作当中需要抓取70000多个网页的内容,并统计出现次数最多的js文件,刚开始的时候觉得可以搞定,但是有几个问题我不得不理清思路,如果你抓取别人的网页,首先做几件事: 1.把每个url地址放在一个文件中; ...
  • 外部.js文件里 下面分别介绍: Javascript在之间: 当浏览器载入网页Body部分的时候,就执行其中的Javascript语句,执行之后输出的内容就显示在网页中。 .... Javascript在之间 有...
  • Java直接运行JavaScript代码或js文件

    万次阅读 2017-11-13 20:07:10
    执行JavaScript用到的类有: javax.script.ScriptEngine; javax.script.ScriptEngineFactory; javax.script.ScriptEngineManager; javax.script.ScriptException;刚哥做事,必须雷厉风行!话不多说,先上代码,一...
  • 以把HTML文件和JS代码分开,并单独创建一个JavaScript文件(简称 JS文件), 其文件后缀通常为 .js,然后将JS代码直接写在JS文件中。

空空如也

空空如也

1 2 3 4 5 ... 20
收藏数 288,463
精华内容 115,385
关键字:

js文件要放在哪