什么是a标签的href ?

a标签的默认跳转链接行为是由href来实现的,同时设置href属性可以使a标签在hover状态下以手指指示的样式显示。但实际过程中发现对a标签的href属性的不同设置,可能会导致不同的行为反馈,故想要进行几种不同的设置情况总结一下。

1.当href不赋任何值时:

<a href></a>
// 不赋值

点击a标签会刷新页面,回到顶部。

2.当href赋值 href="#"时:

<a href='#'></a>

点击a标签后会回到页面顶部,但不刷新页面。

3.当href属性赋值使用javascript:viod(0)语句,并且设置onclick点击事件时:

<a href='javascript:viod(0)' onclick="go()"></a>

javascript:viod(0)语句控制页面不进行跳转也不进行刷新,点击之后也不会回到页面顶部,使用javascript代码阻止了href属性的默认跳转链接行为。a标签点击后会执行onclick中设定函数go()。

4.当href属性赋值使用javascript语句,并设置onclick点击事件时:

<a href='javascript:return false' onclick="go()"></a>

此方法与上一种方法实现效果类似,一样是href属性中执行js代码,使用return false告诉浏览器要阻止href属性的默认行为,如跳转链接,刷新页面,回到顶部等,此方法依然可执行go()函数。

5.当href属性不进行赋值,并设置onclick点击事件时:

<a href onclick="go()"></a>

点击a标签,会触发点击绑定事件,执行函数go()的相关操作,但同时也会由于href的设置进行页面的刷新,当执行绑定事件的操作函数,在完成之前或者执行过程中进行了页面刷新,对应的页面结果也会被重新刷新,并且回到页面顶部。

链接:https://www.jianshu.com/p/8a2bd9792eec。

简单明了《a标签的href》跳转页面情况,看完秒懂!!!相关推荐

  1. html a 点击防止刷新,a标签点击跳转页面不刷新的问题

    作为一位前端新手,刚接触移动端开发不久,遇到的问题真的是一个接着一个... 前面写好了几个页面,今天试着将各个页面的链接打通,然后问题就来了...(╯︵╰) 这里看一下原来想要实现的两个页面跳转的效果 ...

  2. a标签加入单击事件 屏蔽href跳转页面

    我们常用的在a标签中有点击事件: 1. a href="javascript:js_method();" 这是我们平台上常用的方法,但是这种方法在传递this等参数的时候很容易出问 ...

  3. Django 中 a href标签 使用方法 跳转页面(Django第四篇)

    上次我已经用Django启动了一个登录模板页面 具体过程见:Django启动我的第一个模板页面 但问题是我们只能通过监听的端口访问这一个页面,不能通过页面的一些连接跳转到其他页面 如下,我们不能点击注 ...

  4. vue 2个方法先后执行_4个简单靠谱的所得税节税方法,老板看完都批示财务执行...

    所谓企业所得税,就是对我国境内的企业和其他取得收入的组织的生产经营所得和其他所得征收的一种所得税. 它的税率一般是25%,但根据企业类型.税收优惠政策,税率也有所差别,具体详见下表. 可见企业所得税在 ...

  5. 看完秒懂,网站SEO排名其实很简单,必做的五大攻略白狐公羊seo

    随着百度算法的一再更新,网站数量的添加,职业关键词排名比赛变的愈加剧烈,以至于现在许多人以为SEO职业现已失去了生机,纯白maoSEO入手太难了. 但在我看来,做好网站基础是条件. 许多站长没有做相关 ...

  6. cad中简单流程图制作_1600字解读装修施工流程,看完你就入门了!(流程图制作中)...

    又到了一年一度的装修旺季,很多客户也在过完假期后开始看起了装修,但是对于装修,很多客户完全属于小白,不知从何下手,大家可以看看之前小编分享的三篇装修前期的流程,希望对你们有所帮助. 前景回顾(看这里! ...

  7. window location href跳转无效

    问题情况 JS中设置window.location.href跳转无效 原因是 a标签的href跳转会执行在window.location.href设置的跳转之前: 如果是表单form的话  也会先执行 ...

  8. js外链跳转_WordPress为anylink插件外链跳转添加漂亮的跳转页面

    接触WordPress以来,经常在各路大神的网站上学习经验,无意间在张戈博客逛的时候看到,张戈博客跳转到外链时,有个感觉非常舒服的跳转页面: 通过一番寻找,发现张戈也将教程为大家分享了.因为是针对外链 ...

  9. html a标签锚点跳转的简单应用

    html <a>标签锚点跳转的简单应用 <a>标签的最重要功能是实现超链接和锚点.一般来说通常认为 <a>标签最重要的作用是实现超链接,但是就功能来说还有其他的作用 ...

最新文章

  1. 搜索引擎学习(三)Lucene查询索引
  2. std::bind绑定成员函数,为什么第二个参数必须绑定对象地址
  3. 淘宝top平台调用接口响应时间优化
  4. 利用ant构建 jsp-servlet-class-jar
  5. angularjs中 $watch 和$on 2种监听的区别?
  6. kafka入门综合概要介绍
  7. 专访企业QQ SaaS团队,谈企业级LNMP架构设计
  8. 自适应方案比较及案例
  9. Photoshop制作电影胶片效果
  10. c++基础三 (数组——指针)
  11. maya中英文对照_Maya 2018 英汉速查手册
  12. 对 Linux 初级、中级、高级用户非常有用的 60 个命令
  13. matlab 表示希腊字母yita,常用希腊字母读法
  14. 高通滤波器与带通滤波器
  15. 机器学习算法-KMeans聚类算法解析及伪代码实现。
  16. Spring Cloud Hystrix 服务容错保护
  17. liunx 查看oracle监听,Linux配置Oracle监听提示异常
  18. 读书笔记--推荐系统实践(2)
  19. IIC、SPI、UART串行通信以及同步/异步通信学习
  20. linux虚拟网口不同vlan,Openwrt创建虚拟网口(macvlan)

热门文章

  1. 一个故事讲清https
  2. h0143. 铺砖问题 (20 分)
  3. 本地自动化安装CentOS系统
  4. 自然常数e的由来,及欧拉公式
  5. JVM in a nut shell
  6. CATIA V5百科全书系列——操作界面模块(User Interface)
  7. android 不同屏幕,Android 支持不同的屏幕
  8. chrome安装json格式化插件
  9. 2021 最新版 Django 接入 支付(支付宝为例
  10. 手机解码(网上收集)