问题描述:
淘宝首页需要实现这样一个功能,对于页面上非taobao.com域名下的链接,在用户点击时,需要在链接处弹出提示框,提示用户此链接非淘宝域名下的链接,并给与用户选择是否继续访问。如果用户确认继续访问,则在新窗口打开链接。请写出相应的代码。
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>品一品编程-1</title>
</head>
<body>
<a href="https://www.taobao.com">https://www.taobao.com<br/></a>
<a href="https://www.taobao.com/?spm=a218k.m3dyt3534.1581860521.1.6jNnlE">https://www.taobao.com/?spm=a218k.m3dyt3534.1581860521.1.6jNnlE<br/></a>
<a href="https://www.tmall.com">https://www.tmall.com<br/></a>
<script>
/*补充完整程序*/
</script>
</body>
</html>
程序如下:
<script>
/*补充完整程序*/
(function() {
var obj = document.body
var reg = new RegExp('https://www.taobao.com')
obj.onclick = function(ev) { //事件委托
var ev = ev || window.ev //兼容ie
var target = ev.target || ev.srcElement
if(target.nodeName.toLowerCase() === 'a') {
var href = target.href
if(reg.test(href)) {
return
}
else {
ev.preventDefault() //阻止a标签的默认跳转
if(window.confirm(href + ':非淘宝域名下的链接,是否继续访问?')) {
location.href = href
}
else {
}
}
}
}
})()
</script>
执行效果如下:
![0C@3XVL7~M_54O]}D`R]VMD.png](http://upload-images.jianshu.io/upload_images/5319840-076ae99416dbe43a.png?imageMogr2/auto-orient/strip%7CimageView2/2/w/1240)