html中的图片、css、js等路径加载问题

网页文件的存取路径有3种:物理路径、绝对路径和相对路径。

物理路径就是你的文件放在主机上的具体位置,例如:D:\\image\\1.jpg 这种格式,该方法可以很快确定出你的文件,但是在网页显示路径基本很少用。

绝对路径是以网站的根目录(www)作为起始点,某文件在该项目中具体位置信息。比如你的网站放在 /var/www 中,那么 /var/www 就是你的根目录。如果文件 head.jpg 放在该目录的 image 里,那么 head.jpg 的路径信息就是 /image/head.jpg。但是在css和js文件的路径导航中该路径通常无法获得正确的信息。

相对路径就是指当前网页所在的目录为起始点,根据需要一级一级往上找或往下找。

以下为建立路径所使用的几个特殊符号,及其所代表的意义。
  "." --代表目前所在的目录。
  ".."--代表上一层目录。
  "/" --代表根目录。

如果你的目标文件是 /app/views/home/index.php,在该文件想引用 /public/css/style.css,那么文件的相对路径则是:../../../public/css/style.css 。

html中的图片、css、js等路径加载问题,布布扣,bubuko.com

时间: 2024-10-14 21:25:43

html中的图片、css、js等路径加载问题的相关文章

对于HTML页面中CSS, JS, HTML的加载与执行过程的简单分析

最近在研究HTML页面中JavaScript的执行顺序问题.在JavaScript中,定义一个方法或者函数有很多方式,最常见的有2中,function语句式与函数直接量方式. 对于function语句式,解释器会优先解释.即加载了这个js文件后,会扫描一下所有的js代码,然后把该优先执行的东西先执行了,然后再从上到下按顺序执行.所以,定义的代码可以在执行的代码后边.就跟C#中的方法定义一样.解释器已经记住了这个方法,知道在内存中的哪里,用的时候直接去取就行了. C#语言是,对象中的属性与方法具有

js插件动态加载js、css解决方案

最近因为工作需要做了一个js自动导入的插件,一开始很天真的以为动态创建个script添加到head中就ok了,试了之后才发现了问题,就是如果同时引入了多个js文件,而且后一个文件中用到了前一个文件中的变量,那就会报错,靠~~悲催了,就是说js如果动态加载(非浏览器加载因为浏览器加载时同步加载的会等待前一个js加载完成后才进行下一个js加载,这样就不会出现问题)那加载的文件是异步进行的,难怪啊!然后在网上找了些资料说用ajax同步加载,然后我试了真可以,下面就是我的代码分享出来给大家,但是注意这样

图片路径加载失败,火狐浏览器默认显示断裂图片

在谷歌.IE浏览器中,如果图片路径加载失败,会显示一个默认的断裂图片,像这个样子 而在火狐浏览器中,则图片不会有任何占位,这样就会导致布局上的混乱,用户体验也不好,如何让火狐浏览器显示出断裂图片效果呢? 只需在样式文件css中加入这行代码就可以啦 @-moz-document url-prefix(http), url-prefix(file) { img:-moz-broken { -moz-force-broken-image-icon: 1; width:24px; height:24px

html、css、js三者的加载顺序

页面的加载顺序时从上往下加载的: 1.DOM树加载到llink标签 css文件的加载和DOM树的加载是可以同时进行的,也就是说,css在加载时DOM树还在继续构建. 这个过程中如果遇到css样式或者img,会向服务器发送一个请求,待资源返回后,将其添加到DOM中的相应位置. 2.DOM树加载到script标签 由于JS是单线程模式,因此不会与DOM并行加载,因此需要等到整个js文件加载完后再继续加载DOM.倘若JS文件过大,则可能导致浏览器页面显示滞后,出现"阻塞效应". .JS阻塞其

百度地图多点路径加载以及调整页面js

1 $(document).ready(function () { 2 /*用正则表达式获取url传递的地址参数,split后获得地址数组*/ 3 bmap = new BMap.Map('mapcontainer'); 4 var point = new BMap.Point(116.404, 39.915);//地图中心点 5 bmap.centerAndZoom(point, 15);//调整缩放以及设立中心点 6 bmap.enableScrollWheelZoom(); 7 var l

使用jquery插件实现图片延迟加载技术(懒加载)

有时我们看到一些大型网站,页面如果有很多图片的时候,当你滚动到相应的行时,当前行的图片才即时加载的,这样子的话页面在打开只加可视区域的图片,而其它隐藏的图片则不加载,一定程序上加快了页面加载的速度,对于比较长的页面来说,这个方案是比较好的. 这里推荐使用jquery图片延迟加载插件jquery.lazyload实现图片延迟加载提高网站打开速度 下载地址:http://www.appelsiini.net/download/jquery.lazyload.js 修正版:jquery.lazyloa

在IIS上新发布的网站,样式与js资源文件加载不到(资源文件和网页同一个域名下)

在IIS上新发布的网站,网站能打开,但样式与js资源文件加载不到(资源文件和网页是同一个域名下,例如:网页www.xxx.com/index.aspx,图片www.xxx.com/pic.png). 然后单独打开资源文件(例如打开图片的链接)是,报错: 这个问题应该是web.config配置文件的设置问题. 在配置文件的<httpHandlers>下的节点,对应的资源文件的type值设置可能是“System.Web.DefaultHttpHandler”值(默认),例如: <httpHa

[转]css,javascript的预加载

为了提高网站的加载速度,有一个很重要的手段就是在用户浏览过程中的上游网站做一个文件的预加载.预加载文件一般有两种常用的方式:xhr和动态插 入节点的方式.动态插入节点是最为简单也最为广泛的一种异步加载方式(例如yui的Get模块),然后使用动态插入节点方法加载的文件都会在加载后立即执 行,javascript的执行一方面会占用浏览器js执行进程,另一方面也可能改变页面结构,而css的执行更有可能让整个页面变化.xhr方式虽然不 会执行脚本,但是由于同域的限制,且如今网站的静态文件都是部署在cdn

减少JS对页面加载性能影响的方法以及无阻塞脚本(javascript)模式

JS的阻塞特性:当<script>出现的时候,页面必须等待脚本文件的加载.解析.执行完毕后才能继续进行页面的渲染.不管脚本文件是以内联形式还是外部引入的形式出现在<script>中,页面的加载和渲染都必须停下来等待脚本文件的执行完成.因为在脚本文件中可能会修改页面的内容.这就会出现一个问题,当HTML文件中引入很多的外部脚本文件和内联脚本时,可能会导致页面的严重阻塞,影响页面的加载和渲染,用户体验特别的差.因而需要寻找适当的方法来减小脚本文件对页面加载带来的影响. 改善性能的几种方