`
ganqing1234
  • 浏览: 171736 次
  • 性别: Icon_minigender_1
  • 来自: 南京
社区版块
存档分类
最新评论

js和css放置位置

阅读更多

     在开发网页时,尽量将css放置在页面的header里,js不管是外部引入的或嵌入的js片段都应放在页面的尾部。

因为页面在加载时,css加载是可以并发请求 的(同页面中的图片,ie6除外),而js加载时需要等待一个js文件加载完成后才加载其他资源,为了页面的快速呈现,放置在尾部效果较好。

     同时由于嵌入的js片段会阻塞整个页面 的呈现(外部引入js文件阻塞其他资源下载,也会阻塞该js引入位置以下的页面的内容 呈现,所以要放置页面的最下面),需要利用工具来调用,如yui的

YAHOO.util.Event.onDOMReady(function() {...}); 方法,这样至少可以保证页面的框架出来后才执行需要的js方法。

 

分享到:
评论

相关推荐

    JS和CSS实现的烟花效果

    "JS和CSS实现的烟花效果"是一个结合了JavaScript(JS)和层叠样式表(CSS)技术的项目,用于在网页上创建出炫丽的烟花绽放场景。这个项目非常适合网页开发者,特别是初学者用来学习和实践动态效果的实现。 **...

    纯js+css写的柱状图

    "纯js+css写的柱状图"是一个利用JavaScript和CSS实现的自定义柱状图组件,它不依赖任何第三方库,而是通过HTML的`div`元素模拟出柱状图的效果。这样的做法具有灵活性高、自定义性强的优点,同时也对开发者的技术要求...

    html延迟加载JS和CSS

    在给定的文件`lazyLoadJC.js`中,可能实现了一个JavaScript库,用于延迟加载JS和CSS资源。这个库可能包含以下功能: 1. 检测浏览器兼容性,确保在IE6及更高版本上运行。 2. 针对JavaScript的延迟加载,可能使用了`...

    js+css3交互式圆形图标菜单导航代码

    例如,可以使用`border-radius`属性创建圆形图标,通过`transition`实现平滑的动画效果,以及使用`transform`来改变元素的位置和大小,如在点击按钮时展开或收缩子菜单。此外,CSS3选择器可以更精确地定位和控制页面...

    JS、CSS合并压缩工具说明

    JS、CSS 合并压缩工具是用于优化前端资源加载效率的重要工具,它们能够将多个 JavaScript 和 CSS 文件合并为一个文件,并进行压缩,减少网络请求次数,从而提高网页加载速度。本篇将详细介绍名为 TomsTools 的一套 ...

    asp.net后台代码动态引用添加JS和css文件

    在ASP.NET开发中,动态引用和添加JS及CSS文件是一项常用且重要的技能,尤其是在需要根据运行时条件加载不同样式或脚本的情况下。本文将详细解析如何在ASP.NET后台代码中实现这一功能,确保网页能够根据实际需求灵活...

    js+css点击弹出遮罩层图片放大展示demo

    综上所述,这个"js+css点击弹出遮罩层图片放大展示demo"通过结合JavaScript和CSS的力量,实现了优雅的图片放大查看功能,为用户带来了更直观、更具沉浸感的浏览体验。在实际项目中,可以根据需求进行调整和优化,以...

    H5+JS+CSS情人节表白.zip

    总的来说,这个“H5+JS+CSS情人节表白”项目展示了HTML5、CSS3和JavaScript如何协同工作,创造出一个富有创意和互动性的表白页面。通过理解和运用这些技术,开发者可以构建出更加个性化和引人入胜的网页应用程序,...

    饼图可加文字,js+css+html

    在这个“饼图可加文字,js+css+html”的实例中,我们将深入探讨如何使用JavaScript、CSS和HTML这三种核心技术来创建一个带有文字标注的饼图。 首先,JavaScript作为前端开发的核心语言,提供了动态交互的能力。在这...

    js和CSS3图片360度全方位3D预览插件

    总的来说,这款js和CSS3图片3D预览插件是网页交互设计的一大利器,通过巧妙地结合JavaScript和CSS3的3D特性,为用户提供了一种直观、生动的浏览体验。无论是开发人员还是设计者,都能从中受益,提升作品的互动性和...

    CSS特效收藏和js实例

    在IT领域,CSS(Cascading Style Sheets)和JavaScript(JS)是网页设计与开发中的核心技术。CSS主要用于定义页面的布局、颜色、字体等视觉样式,而JavaScript则负责交互性和动态功能。本资源集合——"CSS特效收藏和...

    javascript菜单和css换肤

    JavaScript 菜单和 CSS 换肤是网站前端开发中的重要组成部分,它们极大地提升了用户体验,使得用户界面更加互动和个性化。在这个主题中,我们将深入探讨 JavaScript 菜单的实现原理、CSS 换肤的技术细节以及如何将...

    css + js 菜单选项卡 网站导航栏

    2. **定位和布局**:利用CSS的布局技术,如浮动(float)、绝对定位(position: absolute)或固定定位(position: fixed),可以将导航栏放置在页面的顶部、底部或其他合适的位置。 3. **交互效果**:通过CSS伪类...

    js+css3全屏折角导航菜单和右下角悬浮分享按钮特效

    在本文中,我们将深入探讨如何使用JavaScript(js)和CSS3技术来创建一款创新的全屏折角导航菜单以及右下角悬浮分享按钮的特效。这个特效为网站增添了一种现代且互动的用户体验,使用户能够更直观地探索网页内容。 ...

    Yahoo!网站性能最佳体验的34条黄金守则__JavaScript和CSS

    - **实践建议**:始终将JavaScript和CSS放置在单独的文件中,并确保这些文件的URL保持不变,以便于浏览器缓存。此外,还可以通过设置合适的HTTP缓存控制头来增强缓存效果。 **4. 削减JavaScript和CSS** - **背景与...

    js,css压缩工具

    JavaScript(简称JS)和CSS是网页开发中的关键组成部分,它们分别负责网页的动态交互和样式设计。为了提高网页加载速度和优化用户体验,开发者通常会使用压缩工具对JS和CSS文件进行压缩。本教程将详细介绍如何使用一...

    JavaScript+css实现拖拽效果

    本文将详细讲解如何使用JavaScript和CSS来实现这一效果,以创建一个可拖拽的元素并处理其在页面上的位置。 首先,我们需要理解JavaScript在拖放功能中的角色。JavaScript提供了`dragstart`、`drag`、`dragend`以及`...

    CSS设置漂亮的JS对话框

    5. **CSS Grid布局**:对于更复杂的对话框布局,CSS Grid提供了一种二维网格系统,允许在行和列上精确地放置元素。对话框的标题、内容区和按钮区域可以用Grid轻松布局。 6. **样式细节**:为了让对话框看起来更加...

    网页期末作业+html+css+js(大鱼海棠)

    10个页面,学校让做的网站作业,虽然是比较基础的网页静态页面,不过我也希望你能做的规范一些,我们专业制作学生网页作业,div css js 等通过dreamwear的工具实现规范化,比如文件夹的规范,代码写作的规范,虽然...

    原生态js和css3制作X轴Y轴的3D照片墙

    在IT领域,尤其是在Web开发中,使用原生JavaScript和CSS3技术可以实现许多创新和吸引人的效果。本案例中提到的“X轴Y轴的3D照片墙”就是这样一个例子,它利用了这两种技术的强大功能来创建一个立体、动态的展示照片...

Global site tag (gtag.js) - Google Analytics