a标签中的javascript:;是什么

一、问题

<a>标签中href="javascript:;"表示什么意思??

<a id="jsPswEdit" class="set-item" href="javascript:;">修改密码</a> 
有一种说法是:href="javascript:;"会去解析<script></script>里面的代码,跟当前<a>标签有关的就会执行,.没关的就跳过。
是不是这样理解呢?

二、解答

1、

<a> 标签的 href 属性用于指定超链接目标的 URL,href 属性的值可以是任何有效文档的相对或绝对 URL,包括片段标识符和 JavaScript 代码段

这里的href="javascript:;",其中javascript:是伪协议,它可以让我们通过一个链接来调用javascript函数.而采用这个方式 javascript:;可以实现A标签的点击事件运行时,如果页面内容很多,有滚动条时,页面不会乱跳,用户体验更好。

2、

javascript: 是一个伪协议,其他的伪协议还有 mail:  tel:  file:  等等。

1
<a id="jsPswEdit" class="set-item" href="javascript:;">修改密码</a>

javascript:是表示在触发<a>默认动作时,执行一段JavaScript代码,而 javascript:; 表示什么都不执行,这样点击<a>时就没有任何反应。

一般在这种情况下,会给<a>绑定一个事件回调,来执行业务,如:

1
2
3
4
document.getElementById('jsPswEdit').addEventListener('click'function(e) {
  e.preventDefault();
  // 当<a>触发click时,处理业务
}, false);
我能不能这样理解:href="javascript:;"就是去掉a标签的默认行为,跟href="javascript:void(0)"是一样的?
是一样的,
void 是JavaScript 的一个运算符,void(0)就是什么都不做的意思

3、

简单来说,"javascript:"是另外一种嵌套js代码在网页中的方法
跟通过<script></script>标签嵌套js代码差不多

如点击下面链接会会执行"javascript:"后面的内容。不过不推荐这种写法。
理由是使用<a>标签href属性通常是保存超链接,用来控制页面转向

1
<a href = "javascript:alert(22);">点我</a>

三、实例

1、a标签中的javascript:;实现列表下拉

<a href="javascript:;" class="nav-link tpl-left-nav-link-list">

2、javascript:;实现页面跳转

 <button type="button" tooltip="添加栏目" class="btn btn-sm btn-azure btn-addon" onClick="javascript:window.location.href = '{:url('cate/add')}'"> <i class="fa fa-plus"></i> Add
</button>
												

a标签中的javascript:;是什么的更多相关文章

  1. <a>标签中href="javascript:;"** 为什么 style不用src**

    &src/href <!--href 用于标示资源和文档关系,src 用于替换标签内容--> <img src="xxx.jpg"/> <sc ...

  2. 在<a></a>标签中调用javascript脚本

    有时候,我们点击了<a></a>标签(除了跳转到指定链接外)想要它调用某个方法,及调用javascript脚本,该如何做: 方法1:<a href="javas ...

  3. a标签中关于javascript:void(0)的几个问题

    最近看了好几个关于<a>标签和javascript:void(0)的帖子,谨记于此,以资查阅.注:以下代码未经全面测试,但每一种方法可能会出现的情况都基本做了说明. 在做页面时,如果想做一 ...

  4. 标签中href="javascript:;"表示什么意思?

    1.标签的 href 属性用于指定超链接目标的 URL,href 属性的值可以是任何有效文档的相对或绝对 URL,包括片段标识符和 JavaScript 代码段. 2.javascript: 是一个伪 ...

  5. <a>标签中href="javascript:;"

    javascript: 是一个伪协议,其他的伪协议还有 mail:  tel:  file:  等等. 1 <a id="jsPswEdit" class="set ...

  6. <a>标签中href="javascript:;"的意思

    <a> 标签的 href 属性用于指定超链接目标的 URL,href 属性的值可以是任何有效文档的相对或绝对 URL,包括片段标识符和 JavaScript 代码段. 这里的href=&q ...

  7. Web - <a>标签中href="javascript:;"

    javascript: 是一个伪协议,其他的伪协议还有 mail:  tel:  file:  等等. 1 <a id="jsPswEdit" class="set ...

  8. a标签中的javascript:void(0)和#的区别

    #包含了一个位置信息 默认的锚是#top 也就是网页的上端 而javascript:void(0)   仅仅表示一个死链接 void(0)用于执行某些处理,但是不整体刷新页面 javascript:v ...

  9. javaScript中的小细节-script标签中的预解析

    首先介绍预解析,虽然预解析字面意思很好理解,但是却是出坑出的最多的地方,也是bug经常会有的地方,利用好预解析的特性可以解决很多问题,并且提高代码的质量及数量,浏览器在解析代码前会把变量的声明和函数( ...

随机推荐

  1. DC、CDC及CDC的各个子类

      设备描述表是一个包含设备信息的结构体(物理设备如显示器.打印机),MFC中关于图像操作都需要DC来完成.HDC是Windows的一种数据类型,是设备描述句柄:CDC是MFC封装的Windows 设 ...

  2. canvas为什么你指定一个比较小的宽高,但它实际占位却很多?

    ccanvas默认的宽高占位是:300*150  px  所以当你画一个普通的举行,你指定的宽高小于默认宽高的时候,通过审查元素发现周围都是空白的.

  3. php重新编译,gd扩展支持jpeg文件

    晚上写东西的时候,报了一个错误: Call to undefined function imagecreatefromjpeg() 没有开启 jpeg 支持?原来是默认安装的 gd 扩展默认不支持 j ...

  4. git rebase 的使用 (用于撤销某次commit)

    Q: I wrote the wrong thing in a commit message. Alternatively, I've forgotten to include some files. ...

  5. Linux下的压缩与解压缩

    1 .gz 1)压缩 root@xiaohuang-virtual-machine:/home/xiaohuang/桌面/hellow/hellow# gzip 2.txt 3.txt root@xi ...

  6. Linux 中常用的基础命令一

    1.目录相关命令的使用  pwd(printing working directory) 显示当前工作目录    pwd命令相关的环境变量:     PWD  保存了当前工作目录路径     OLDP ...

  7. Linux 基础入门二

    1.远程连接  ssh协议:secure shell  ~]# ss -tnl 查看系统是否监听在tcp协议的22号接口:  ~]# ip addr list 或者 ifconfig 查看ip地址 确 ...

  8. Express的初步使用

    废话不多说直接上步骤: 1. 首先建立一个新文件夹,进入此文件夹的命令窗口通过 npm init 命令为你的应用创建一个           package.json 文件,然后下载express模块 ...

  9. Attach、Detach和DeleteObject

    原文:Attach.Detach和DeleteObject,想飞的梦想 1.CWnd Attatch和Detach的关系 首先,要明白Windows对象和MFC对象的区别. MFC对象实际上并没有把整 ...

  10. 优化数据页面(20)——1:n的数据关系

    设计要点:优化数据页面.界面设计.美化exce 阿金:那一对多的关系-- 秀秀:不是:n结构么? 阿金:嗯,这俺知道.俺特别喜欢这样的格式,那样显得非常上档次! 秀秀:俺也喜欢. 由于页面上有空白,认 ...