巅云智能建站平台搭建版(创业流派版)火爆上线,毕生受权!新增:文章智能收罗+全站真静态打包+都会分站+智能小法式+不法词过滤+H5自顺应+智能链词等功效功效概况
赞助文档Help

HTML中的base标签利用详解

一佰互联网站建造(www.taishanly.com) 宣布日期 2020-04-20 08:53:24 阅读数: 119

在requireJS中,有一个属性叫baseURL,经由过程设置baseURL,咱们能够将须要加载的文件途径写成绝对名目的,而不是绝对以后页面的。

比方:假定咱们的名目目次是/myproject/,外面有两个页面,一个是/myproject/one.html,另外一个是/myproject/html/other.html,他们都要加载/myproject/js/some.js。若是咱们将baseURL设置成/myproject/,则咱们在加载该js的时辰,这两个页面都能够利用绝对名目的途径./js/some,而不是由于页面的途径差别而利用差别的绝对途径。

可是若是不利用requireJS,咱们能不能完成近似于baseURL的功效呢?

base标签
实在,HTML中有一个base标签,能够发生近似的功效。举个例子:

复制代码代码以下:
<html>
<head>
<base href="http://static.cnblogs.com/" />
</head>
<body>
<img src="./images/logo_gray.gif" />
</body>
</html>

咱们会发明,咱们用绝对途径./images/logo_gray.gif加载的图片,却变成了http://static.cnblogs.com/images/logo_gray.gif的图片。

base标签能够给页面的链接加上默许的途径,或默许的翻开体例。

上面是一个设置默许翻开体例的例子:

复制代码代码以下:
<html>
<head>
<base target="_blank" />
</head></p> <p><body>
<a href="http://www.cnblogs.com">这个页面会在新窗口翻开</a>
<a href="http://justany.cnblogs.com">这个页面也会在新窗口翻开</a>
</body>
</html>

一个BUG
base标签最好不要静态写入,不然在Firefox和IE中会有一个小bug,比方对页面http://localhost/static/test.html:

复制代码代码以下:
<html>
<head>
<script>
document.write("<base href="http://localhost/" />");
</script>
</head></p> <p><body>
<img src="static/1.jpg" />
</body>
</html>

Firefox和IE中会先加载http://localhost/static/static/1.jpg,而后再加载http://localhost/static/1.jpg。也便是说,他们都先测验测验用绝对以后页面的途径停止加载,而后再经由过程base标签设置的默许途径加载。

Chrome的加载一般。

Firefox的加载不一般。

 

Why?

这个咱们并不找到很好的诠释,咱们的阐发是阅读器对资本加载停止了优化,致使静态拔出base标签并未失效时,就事后去加载了,成果犯错,而后base标签失效因而又加载准确的资本。

 

若何避免呢?不静态写入base标签那末就不任何题目。若是须要静态写入base标签,那末页面一切援用的内部资本都须要经由过程Javascript静态加载。

一佰互联是天下着名建站品牌办事商,咱们有九年、网站建造、网页设想、php开辟和域名注册及假造主机办事经历,供给的办事更是天下着名。比来几年来还整合团队上风自立开辟了可视化多用户”“3.0平台版,拖拽排版网站建造设想,轻松完成pc站、手机微网站、小法式、APP一体化全网营销网站扶植 ,已胜利的为天下上百家收集公司供给自助建站平台搭建办事。

相干消息more

06
11月
网站建造哪些方面倍受存眷

企业建造网站是形式所需,由于此刻大局部企业都有属于本身的网站。岂但用来鼓吹企业抽象,还用来发卖产物。网站对客户而言是很罕见的,而企业建造网... >>概况

26
03月
切磋收集宁静应答办法 网空要挟匹敌与态势感知

简介:西南网1月9日讯(记者 陈显春)1月8日-9日,收集空间要挟匹敌与态势感知钻研会暨第六届安天收集宁静冬训营在哈尔滨召开,本届冬训营以“... >>概况

01
05月
宣布一个迷你php+AJAX谈天法式[谈天室

MiniAJAXChatroomByLongbill http://www.longbill.cn Longbillallrightsres... >>概况

20
04月
详解HTML5中的拖放事务(Drag 和 d

阅读器撑持Internet Explorer 9、Firefox、Opera 12、Chrome 和 Safari 5 撑持拖放。正文:在... >>概况

高端网站扶植

美工统筹SEO,为企业电子商务营销助力!

德律风:

023-85725751
建站

产物

域名注册 假造主机 云办事器 企业邮局
智能建站 APP打包 微站/小法式 创业平台
网站推行 媒体营销 智能收罗 AI机械人
400德律风 短信营销 店销机械人
私家定制 流派网站