Go语言视频零基础入门到精通

admin

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
      
   
     
     
     

1. <

复制代码

     

1. a

复制代码

     

1. id

复制代码

     

1. =

复制代码

     

1. "jsPswEdit"

复制代码

     

1. class

复制代码

     

1. =

复制代码

     

1. "set-item"

复制代码

     

1. href

复制代码

     

1. =

复制代码

     

1. "javascript:;"

复制代码

     

1. >修改密码</

复制代码

     

1. a

复制代码

     

1. >

复制代码

      
      
   
  

javascript:是表示在触发<a>默认动作时，执行一段JavaScript代码，而 javascript:; 表示什么都不执行，这样点击<a>时就没有任何反应。
  
一般在这种情况下，会给<a>绑定一个事件回调，来执行业务，如：

  
   
   
   
     1
     
   
     2
     
   
     3
     
   
     4
      
   
     
     
     

1. document.getElementById(

复制代码

     

1. "jsPswEdit"

复制代码

     

1. ).addEventListener(

复制代码

     

1. "click"

复制代码

     

1. ,

复制代码

     

1. function

复制代码

     

1. (e) {

复制代码

      
     
     

1.   

复制代码

     

1. e.preventDefault();

复制代码

      
     
     

1.   

复制代码

     

1. // 当<a>触发click时，处理业务

复制代码

      
     
     

1. },

复制代码

     

1. false

复制代码

     

1. );

复制代码

      
      
   
  

  

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

复制代码

1. 是一样的，

复制代码

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

复制代码

  
3、
简单来说，"javascript:"是另外一种嵌套js代码在网页中的方法。
跟通过<script></script>标签嵌套js代码差不多。
如点击下面链接会会执行"javascript:"后面的内容。不过不推荐这种写法。
理由是使用<a>标签href属性通常是保存超链接，用来控制页面转向。
  

  
   
   
   
     1
      
   
     
     
     

1. <

复制代码

     

1. a

复制代码

     

1. href = "[b]javascript:alert(22);[/b]">点我</

复制代码

     

1. a

复制代码

     

1. >

复制代码

      
      
   
  

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

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

复制代码

  
2、javascript:;实现页面跳转

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

复制代码

  
  
  
  
  
[code][/code]