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. Importing Maven projects' has encountered a problem

    导入项目是报错,这个是maven问题--Importing Maven projects' has encountered a problem ---------------------------- ...

  2. [JSON] 前后台如何通过$.ajax()传输JSON数据

    说明:slesecByPriomaryKey是通过empno来获得Emp对象. 前台1: $(function() { $.ajax({ type : "POST", url : ...

  3. 基于Python——实现远程下载sftp文件(只下载.zip文件)

    [背景]远程下载发布包等文件时,总是要使用WinSCP等工具登陆拖动.今天就介绍一种使用python下载文件到本地的方法. [代码实现] import paramiko # paramiko模块,基于 ...

  4. linux c使用socket进行http 通信,并接收任意大小的http响应(二)

    先贴请求头部信息组织代码. 有同学会疑问http_url.h是干什么用的,我要在这里声明,http_url.h并不是给http_url.c用的,实际上http_url.h声明了http_url.c已经 ...

  5. jsp页面错误

    错误提示:The superclass javax.servlet.http.HttpServlet was not found on the Java Build Path. 解决办法:在build ...

  6. java变量的作用域和基本数据类型转换

    1.变量的作用域 赋值运算符 变量名 = 表达式 列: a = (b+3)+(b-1) 表达式就是符号(如:加号,减号)与操作数(如:b,3)的组合 自动类型转换(隐式类型转换):从小类型到大类型可以 ...

  7. selenium 常用操作

    官方文档: https://selenium-python.readthedocs.io/api.html#selenium.webdriver.remote.webdriver.WebDriver. ...

  8. [Leetcode 46]全排列 Permutations 递归

    [题目] Given a collection of distinct integers, return all possible permutations. 数组的组合情况. Input: [1,2 ...

  9. VSTO:使用C#开发Excel、Word【13】

    应用程序对象的操作本章将介绍从Application对象开始的Excel对象模型中的一些主要对象. Excel对象模型中的主要对象有许多方法和属性,完全描述这些对象超出了本书的范围.相反,本章重点介绍 ...

  10. 第九节 java7JDK的常用封装类型

    一.Java Scanner类 /初始化一个 scanner 对象. Scanner scanner = new Scanner(System.in); //判断语法 boolean b = scan ...