html:

<div href="http://www.atigege.com" target="_blank">个人网站</div>

js代码:

clickToHref();
//点击链接事件,IE8及以下不支持,IE9 strict mode不支持,20181019 by 阿提
function clickToHref() {
var eles = document.querySelectorAll("div[href]");
eles.forEach(function (item) {
item.addEventListener("click", function () {
var href = item.getAttribute("href");
var target = item.getAttribute("target");
if (!target) {
location.href = href;
}
else {
window.open(href, target);
}
});
})
}

不支持IE8以下原因:document.querySelectorAll

eles.forEach不支持IE9的 strict mode模式

原生JS怎样给div添加链接的更多相关文章

  1. 原生js实现一个DIV的碰撞反弹运动,并且添加重力效果

    继上一篇... 原生js实现一个DIV的碰撞反弹运动,并且添加重力效果 关键在于边界检测,以及乘以的系数问题,实现代码并不难,如下: <!DOCTYPE html> <html la ...

  2. 原生js实现一个DIV的碰撞反弹运动

     原生js实现一个DIV的碰撞反弹运动: 关键在于DIV的边界检测,进而改变运动方向,即可实现碰撞反弹效果. <!DOCTYPE html> <html lang="en& ...

  3. 原生js实现类的添加和删除,以及对数据的add和update、view ,ajax请求 ,页面离开的操作

    1 类操作 function hasClass(cla, element) { if(element.className.trim().length === 0) return false; var ...

  4. 原生js实现点击添加购物车按钮出现飞行物飞向购物车

    效果演示: 思路:核心->抛物线公式 let a = -((y2-y3)*x1 - (x2-x3)*y1 + x2*y3 - x3*y2) / ((x2-x3) * (x1-x2) * (x1- ...

  5. html div 添加链接

    <html> <body> <a href="http://www.w3school.com.cn/" target="_blank&quo ...

  6. 原生js移除或添加样式

    样式效果如下,点击商品详情 添加样式active 代码 <!doctype html> <html lang="en"> <head> < ...

  7. 通过原生JS实现为元素添加事件

    自己写了一个为元素添加事件的方法,并封装到对象中. 说明: id : 目标元素的ID type: 事件的类型,注意的是不能加on fn:事件处理程序 isBubble :规定事件流 代码: var b ...

  8. js在以div添加滚动条

    给予div另外,当我们必须定义高度和宽度的滚动条,使滚动条是有效,增加样式:overflow:auto; 版权声明:本文博主原创文章.博客,未经同意不得转载.

  9. 原生JS去解析地址栏的链接?超好用的解决办法

    在做SPA应用程序的时候,往往需要通过地址栏链接的 hash 值来进行业务逻辑: <script type="text/javascript"> //file:///C ...

随机推荐

  1. 使用python内置库pytesseract实现图片验证码的识别

    环境准备: 1.安装Tesseract模块 git文档地址:https://digi.bib.uni-mannheim.de/tesseract/ 下载后就是一个exe安装包,直接右击安装即可,安装完 ...

  2. 环境准备—之—linux下安装jdk

    本文大部分转自  https://www.cnblogs.com/Dylansuns/p/6974272.html openjdk与jdk的区别 ----反正不一样,要不名字也不会不相同了 https ...

  3. SpringBoot MyBatis 配置多数据源 (静态多个)

    转载地址:https://www.jianshu.com/p/118ca1d5ecf9?utm_campaign=haruki&utm_content=note&utm_medium= ...

  4. js 字符串跟数组的相互转化

    一:字符串转化为数组 例子: var str = "3:2;2:1"; 要变成 arr= [{ a:"3", b:"2", bol:fals ...

  5. call、apply、bind,你有多了解?

    call.apply.bind 1.相同也不同 我们先从浅显的部分开始讲, 这三个方法都可以改变this的指向,都可以进行传参,第一个参数都是修改this的指向 call() 和 apply() 改变 ...

  6. MySQL的BLOB类型(解决mysql不支持mb4编码的时候存储emoji表情问题)

    今天在存储emoji表情的时候,发现无法存储,mysql版本太低也没办法使用uft8mb4格式编码,只能将数据字段设置为blob BLOB是一个二进制大对象,可以容纳可变数量的数据.有4种BLOB类型 ...

  7. python_6

    set 集合 {} 无序 s = {1,2,3,4,5} s = {}print(type(s)) # 空{}就是字典 s = {1,2,3,4,5}s = {1,2,3,'22','ss',Fals ...

  8. 人群密度估计 CrowdCount

    最近在看人群密度估计方面的东西,把博客看到的一些方法简单总结一下,后续继续添加. 1.论文<CrowdNet: A Deep Convolutional Network for DenseCro ...

  9. Pycharm中flask框架应用

    flask框架应用实例 get方法 服务器端 server.py 如下 import flask app=flask.Flask(_name_) //启动一个应用程序 @app.rout(" ...

  10. c++ 生成dll文件并调用-转

    .h(头文件) .lib(库文件) .dll(动态链接库文件) 之间的关系和作用的区分   .h头文件是编译时必须的,lib是链接时需要的,dll是运行时需要的. 附加依赖项的是.lib不是.dll, ...