午接到博客访客的反馈,表示博客中的链接在原窗口打开的话,网站的体验非常的不好,而自己又懒的一个个去修改博客网页中的链接打开方式,就加了一个强制页面所有链接新窗口打开的代码,一招解决问题。
<base target="_blank">
将此代码放到,网页中的 <head>标签之内即可实现,当前页面所有A链接新窗口打开
<base>:标签当前页面上的所有的相对链接规定默认 URL 或 默认目标。
语法:
<base href="网址" target="打开的方式">
属性;
herf:规定的默认链接
target:链接打开的方式,参数有 _blank,_self 等,与A标签的 target 属性相同
<base target="_blank">
<base target="_self">
<!DOCTYPE html> <html lang="en"> <head> <base href="https://www.feiniaomy.com" target="_blank"> <title>Document</title> </head> <body> <a href="/post/1.html">我是相对链接,我可以打开 https://www.feiniaomy.com/post/1.html</a> <a href="http://www.baidu.com">我是绝对链接,我可以打开 http://www.baidu.com</a> </body> </html>
1、一个页面中,<base> 标签只能出现一次
2、<base> 标签只能在 <head></head>标签中出现
3、<base> 属于单标签,没有结束标签,类似 <img> 标签
单击带有超链接的文件时,超链接的内容有多种,打开方式,如替换当前页打开,在新窗口打开等。而用来指定打开方式的是<a>标签的target属性。
如果在一个<a>标签内容含一个target属性,浏览器将会载入和显示用这个标签的href属性命名的、名称与这个目标吻合的框架或者窗口中的文档。如果这个指定名称或id的框架或者窗口不存在,浏览器将打开一个新窗口,并给这个窗口一个指定的标记,然后将新的文档载入那个窗口。从此以后,超链接文档就可以指向这个新的窗口。
target属性的代码格式如下:
<a target="value">
其中value有四个参数可用,这4个保留的目标名称用作特殊的文档重定向操作。
(1)-blank。浏览器总在一个新打开、未命名的窗口中载入目标文档。
(2)-self。这个目标的值对所有未指定目标的<a>标签是默认目标,使得目标文档载入并显示在相同的框架或者窗口中作为源文档。这个目标是多余且不必要的,除非和文档标题 <base>标签中的target属性一起使用。
(3)-parent。这个目标使得文档载入父窗口或者包含超链接引用的框架的框架集。如果这个引用是在窗口或者顶级框架中,那么它与目标-self等效。
(4)-top。这个目标使的文档载入包含这个超链接的窗口,用-tap目标将会清除所有被包含的框架并将文档载入整个浏览器窗口。
小提示:这些target的所有4个值都以下划线开始。任何其他用一个下划线作为开头的窗口或者目标都会被浏览器忽略,因此,不要将下划线作为文档中定义的任何框架name或id的第一个字符。
下面举例说明target属性的使用方法。
(1)编写代码如下图所示:
(2)在浏览器中打开文件,预览效果如下所示:
(3)单击超链接,在新窗口打开连接页面,下图所示
(4)修改代码并单击链接。
将“-blank”换成“-self”,即代码修改为“<a href="http://www.sina.com.cn" target="_self">新浪</a>”,单击链接后,直接在当前窗口打开新链接,如图所示:
个项目切图需要用到的,做个笔记。
jquery打开新窗口window.open和新窗口操作父窗口window.opener,支持jquery写法,支持打开窗口带参数,新窗口url获取参数等等。
打开新窗口
function newDialog(id){
var url = 'dialog.html?id='+id;
var iWidth = 260;
var iHeight = 550;
var iTop = (window.screen.height-30-iHeight)/2;
var iLeft = (window.screen.width-10-iWidth)/2;
window.open(url,'newBridge','left='+iLeft+',top='+iTop+',width='+iWidth+',height='+iHeight+',location=no,resizable=yes,status=no,toolbar=no,menubar=no');
}
新窗口操作父窗口
document.getElementById("get_selected_vals").onclick = function (){
//alert(yntree.getValues());
//var windowOpener=window.opener;
var parent=$(window.opener.document);
var id = getQueryString('id');
parent.find('#'+id).val(yntree.getValues());
//windowOpener.location.reload(true);
window.close();
}
获取url参数
//alert(getQueryString('id'));
function getQueryString(name) {
var reg = new RegExp("(^|&)" + name + "=([^&]*)(&|$)", "i");
var r = window.location.search.substr(1).match(reg);
if (r != null) return unescape(r[2]);
return null;
}
本文由专业的WEB前端外包公司-切图网原创,切图网始于2007年,提供高品质的前端开发服务、前端外包、切图外包。欢迎来电咨询!
*请认真填写需求信息,我们会在24小时内与您取得联系。