HTML中给div加超链接

HTML中给div加超链接

前言

​ 最近开发一个静态公司官网，其中有四个推荐位，推荐位由图片，标题，简介组成，要求点击推荐位的任意位置皆可跳转到指定页面。

解决方式

方式一

使用 window.location.href 跳转，如下代码所示：

<div class="recommend" onclick="window.location.href='https://first.com';return false">
    <img class="recommend_img" src="/images/recommend/first.png"/>
    <span class="recommend_title">First</span>
    <p class="recommend_desc">
        第一个推荐位
    </p>
</div>

return false：取消默认的事件行为，例如你给a标签增加了href，就会既执行函数也会跳转，例如：hello

方式二

使用 window.open 跳转，语法：window.open(*URL,name,specs,replace*) 参考文档，如下代码所示：

<div class="recommend" onclick="window.open('https://first.com','_self')">
    <img class="recommend_img" src="/images/recommend/first.png"/>
    <span class="recommend_title">First</span>
    <p class="recommend_desc">
        第一个推荐位
    </p>
</div>

_self：代表在当前窗口打开，默认是 _blank，在新页面打开。