a标签中的javascript:;是什么

时间 2019-11-13

原文原文链接

a标签中的javascript:;是什么

1、问题

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

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

2、解答

一、

<a> 标签的 href 属性用于指定超连接目标的 URL，href 属性的值能够是任何有效文档的相对或绝对 URL，包括片断标识符和 JavaScript 代码段。

这里的href="javascript:;"，其中javascript:是伪协议，它可让咱们经过一个连接来调用javascript函数.而采用这个方式 javascript:;能够实现A标签的点击事件运行时，若是页面内容不少，有滚动条时，页面不会乱跳，用户体验更好。java

二、

javascript: 是一个伪协议，其余的伪协议还有 mail: tel: file: 等等。函数

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

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

通常在这种状况下，会给<a>绑定一个事件回调，来执行业务，如：spa

 
      document.getElementById( 
      'jsPswEdit' 
      ).addEventListener( 
      'click' 
      ,  
      function 
      (e) { 
     
      e.preventDefault(); 
     
      // 当<a>触发click时，处理业务 
     
      },  
      false 
      );

我能不能这样理解：href="javascript:;"就是去掉a标签的默认行为，跟href="javascript:void(0)"是同样的？

是同样的，

void 是JavaScript 的一个运算符，void(0)就是什么都不作的意思

三、

简单来讲，"javascript:"是另一种嵌套js代码在网页中的方法。
跟经过<script></script>标签嵌套js代码差很少。code

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

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

3、实例

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

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

二、javascript:;实现页面跳转

1 <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
2 </button>