`

a标签的href属性中的"#"与"javascript:;"的区别

 
阅读更多

众所周知,a标签的最重要功能是实现超链接和锚点。而且,大多数人认为a标签最重要的作用是实现超链接。

其中,a标签内最重要的属性莫过于href了。那么关于href两者之间又有什么区别的呢?今天我们就来探讨一下!

首先我们接触较多的是

 

<a href="javascript:;"></a>
    <a href="#"></a>

 这两种写法。这两种写法到底有什么不同呢?用哪种来写更加规范呢?

 

将href="#"是指联接到当前页面,其实是无意义的,页面也不会刷新。这是一个锚链接。

在制作网页时html语言里的参数,用于指定链接的url ####就是本页链接,href="地址"就是链接到地址 链接本页面 默认本页,不弹出新窗口,空连接时,如果去掉#,则不显示鼠标手型光标。 通俗一点就是 一个 指向本页的假链接 也可以在#后面跟上锚点id 这个实际上是一个书签的另一种用法。

语法:<a href="#书签的名称">链接的文字</a>
链接到不同页面的书签
语法:<a href="链接文件的地址#书签名称">链接的文字</a> (注意引号和#号)
正常情况下点击:<a href="#书签名称">链接的文字</a>这个链接,则光标会自动跳转到本页面的:<a name="书签名称">文字</a>的位置。

如果我们只是想写成一个没有任何事件跳转发生的a标签。我个人并不推荐用<a href="#">这种写法。

但是href这个属性同样可以识别javascript代码段。

其中javascript:  是一个伪协议。它可以让我们通过一个链接来调用javascript函数。但是由于这个函数为空,所以我们调用的就是一个空函数,并不会发生任何实质性的改变。同时可以实现a标签的点击运行。如果当页面里面的内容很多的时候,有了上下滚动条,使用href=“#"会发生跳转到页面顶部的问题。而使用href="javascript:;" 就可以避免页面的乱跳!

所以,如果我们想要写一个死的a标签,使用

 

<a href="javascript:;"></a>

会更有利于增加我们的页面的用户友好度!

 

 

 

2
0
分享到:
评论
1 楼 godlewis 2016-11-26  
用href="#this"就不会乱跳了

相关推荐

    a标签跳转到指定div,jquery添加和移除class属性的实现方法

    如果使用a标签跳转到指定的div区域,则只需要把a标签的href属性设置为“#divId”就好了,比如: &lt;a&gt;跳转到div&lt;/a&gt; 这里是被跳转的区域 第二个,使用jquery添加或者移除class属性 也很简单,使用jquery的方法...

    Web应用安全:href属性与src属性的XSS.pptx

    href属性与src属性的XSS 4 src属性的XSS 3 src属性 2 href属性的XSS 1 href属性 目录 herf属性 href是Hypertext Reference的缩写。 意思是指定超链接目标的URL。 href 属性的值可以是任何有效文档的相对或绝对URL,...

    详解A标签中href=””的几种用法

    众所周知,a标签的最... 这是常用的方法,但是这种方法在传递this等参数的时候很容易出问题,而且[removed]协议作为a的href属性的时候不仅会导致不必要的触发[removed]事件,在IE里面更会使gif动画图片停止播放。W3

    a标签的href与onclick事件的区别详解

    onclick中javascript的区别一般没用到都没注意,但出错时才有些郁闷,看...2.假设链接中同时存在 href 与 onclick,如果想让 href 属性下的动作不执行,onclick 必须得到一个 false 的返回值。不信,你可以将 goGoogle

    a标签href属性和onclick事件的比较介绍

    首先说一下, href属性 和 onclick事件 的执行顺序,当鼠标点击a标签的时候会先执行 onclick事件, 然后才是 href 属性下的动作(页面跳转,或 javascript 伪链接),如果不想执行href 属性下的动作执行,onclick ...

    javascript和jquery修改a标签的href属性

    javascript: 代码如下: document.getElementById(“myId”).setAttribute(“href”,”www.xxx.com”); document.getElementById(“myId”).href = “www.xxx.com”; jquery: 代码如下: $(“#myId”).attr(“href”,...

    a标签调用js的方法总结

    &lt;a&gt; 标签的 href 属性用于指定超链接目标的 URL,href 属性的值可以是任何有效文档的相对或绝对 URL,包括片段标识符和 JavaScript 代码段。 这里的href=”[removed];” rel=”external nofollow” rel=”external ...

    在JS中a标签加入单击事件屏蔽href跳转页面

    这是我们平台上常用的方法,但是这种方法在传递this等参数的时候很容易出问题,而且[removed]协议作为a的href属性的时候不仅会导致不必要的触发[removed]事件,在IE里面更会使gif动画图片停止播放。W3C标准不推荐在...

    详解Html a标签中href和onclick用法、区别、优先级别

    如果不设置 href属性在IE6下面会不响应hover。双击后会选中标签的父容器而非这个一a标签(IE下都存在这一问题)。 代码如下  &lt;a&gt; &lt;a&gt; 假定我们有个fn方法,需要取到这个元素,第一个方法传入的this是空值。 所以,...

    详解a标签添加onclick事件的几种方式

    这种方法在传递this等参数的时候很容易出问题,而且[removed]协议作为a的href属性的时候不仅会导致不 必要的触发[removed]事件,在IE里面更会使gif动画图片停止播放。W3C标准不推荐在href里面执行 javascript语句 2....

    better-chrome:chrome扩展插件,去掉知乎登录窗口,替换a标签href属性,主要做一些便利的小改动,欢迎大家提意见(https

    Better Chrome1.... 替换 steam a 标签 href 属性与第一点类似,去掉二次弹窗3. 去掉知乎(包括知乎专栏)未登录弹窗开关控制安装打开 chrome 扩展程序的开发者模式在项目根目录,加载已解压的扩展程序

    前端 javascript 实现文件下载的示例

    在 html5 中,a 标签新增了 download 属性,包含该属性的链接被点击时,浏览器会以下载文件方式下载 href 属性上的链接。示例: &lt;a&gt;下载&lt;/a&gt; 1. 前端 js 下载实现与示例 通过 javascript 动态创建一个包含 download...

    video-stream:使用流属性扩展视频标签的自定义元素 #html5 #webcomponents #javascript

    &lt;视频流&gt; 扩展 &lt;video&gt; 标签以在媒体分辨率之间自动... link rel =" import " href =" ./components/video-stream " &gt; 开始使用吧! &lt; video is =" video-stream " &gt; &lt;/ video &gt; 选项 所有

    javascript函数的解释

    javascript函数的解释,解释了具体函数的功能,一、函数JavaScript函数集合 1.document.write(""); 输出语句 2.JS中的注释为// 3.传统的HTML文档顺序是:document-&gt;html-&gt;(head,body) 4.一个浏览器窗口中的DOM顺序是:...

    css介绍快速学习

    在定义的中,多个标签的class属性值可以相同,而id值要唯一,因为JavaScript中经常用。 8.class选择器: 在标签中定义class属性并赋值。通过标签名.class值 对该标签进行样式设置。 例: 相同标签设置不同样式的...

    Web前端高级作业一.txt

    例:p[attribute~=value],指的是attribute中包含value的值以及,并与其他内容通过空格隔开的p标签 2.3.4连字符标签 例:|=,属性为value或以value开头的 2.3.5前缀选择器 例:^=,属性以value开头的 2.3.6子串...

    javascript中return,return true,return false三者的用法及区别

    例如,默认情况下,点击一个&lt;a&gt;标签元素,页面会跳转到该元素href属性指定的页. 而return false就相当于终止符,return true就相当于执行符. 在js中return false的作用一般是用来取消默认动作的.比如你单击一个链接除了...

    js下载文件并修改文件名

    用js下载文件,使用&lt;a&gt;标签,添加download属性即可。 var a = document.createElement(a); a.href = http://XXX.com/audioStream/8a9dbae9d0859e48fc1f590fcf6d4ccc.mp3; a.download =test.mp3; a.click(); 但是...

    a 中调用js的几种方法整理及使用推荐

    这是我们平台上常用的方法,但是这种方法在传递this等参数的时候很容易出问题,而且[removed]协议作为a的href属性的时候不仅会导致不必要的触发[removed]事件,在IE里面更会使gif动画图片停止播放。W3C标准不推荐在...

Global site tag (gtag.js) - Google Analytics