淘宝首页链接跳转，非taobao.com域名下的链接处理

最新推荐文章于 2022-11-22 17:05:34 发布

Brittany爱编程

最新推荐文章于 2022-11-22 17:05:34 发布

阅读量5.1k

点赞数 1

分类专栏： 2015淘宝校招前端在线测验题目集

本文链接：https://blog.csdn.net/jjting/article/details/38961153

版权

2015淘宝校招前端在线测验题目集专栏收录该内容

1 篇文章 0 订阅

订阅专栏

淘宝首页需要实现这样一个功能，对于页面上非taobao.com域名下的链接，在用户点击时，需要在链接处弹出提示框，提示用户此链接非淘宝域名下的链接，并给与用户选择是否继续访问。如果用户确认继续访问，则在新窗口打开链接。请写出对应的代码。

<!DOCTYPE html>
<html>

<head>
	<meta charset="utf-8"></meta>
    <title></title>
</head>

<body>
	<a href="http://www.taobao.com">taobao.com</a>
	<a href="http://m.taobao.com">taobao.com</a>
	<a href="http://www.baidu.com">baidu.com</a>

	<script type="text/javascript" src="link.js"></script>
</body>

</html>

//Method 1 对事件进行处理。这样做的好处是避免了对每一个a标签进行逐个绑定，节省了时间开销，另外代码更简洁。
(function() {
    var b = document.body;
    var reg = /^(https?:\/\/)?([\da-z\.-]+)\.\btaobao\b\.com([\/\w \.-]*)*\/?$/;

    function doClick(event) {
        if (event.target.tagName == 'A') {
            event.preventDefault();
            var href = event.target.href;
            if (reg.exec(href)) {
                location.href = href;
            } else {
                if (window.confirm("非本地站点，是否继续？")) {
                    location.href = href;
                }
            }
        }
    }
    b.onclick = doClick;
})();

//Method 2
(function() {
	var hrefs = document.getElementsByTagName('a');
	for(var i=0; i <hrefs.length; i++) {
		var href = hrefs[i].getAttribute("href");
		hrefs[i].onclick = function(href) {
			return function() {
				var reg = /^(https?:\/\/)?([\da-z\.-]+)\.\btaobao\b\.com([\/\w \.-]*)*\/?$/;
				if(reg.exec(href)) {
					return true;
				} else {
					return window.confirm("非本地站点，是否继续？");
				}
			}
		}(href);
	}
})();

Brittany爱编程

关注

1
点赞
踩
3

收藏

觉得还不错? 一键收藏
0
评论
淘宝首页链接跳转，非taobao.com域名下的链接处理

淘宝首页需要实现这样一个功能，对于页面上非taobao.com域名下的链接，在用户点击时，需要在链接处弹出提示框，提示用户此链接非淘宝域名下的链接，并给与用户选择是否继续访问。如果用户确认继续访问，则在新窗口打开链接。请写出对应的代码。
复制链接

扫一扫