这边见大家都用href="javascript:;">。当然之前偶然看了张鑫旭一篇《疑问:为什么要使用href=”javascript:void(0);”?》...,从中窥测之前多用的是href="javascript:void(0);">。但为什么要用这个,他本人也没弄明白,然后读完,我也没明白。...我坚信这一点。惹出些问题并不见得都是坏事。每每因为自己的造成的这些个问题,反倒收获不少,?。 之后就去查证了下关于这Html标签的Href属性。超链接的 URL。...- 指向页面中的锚(href=”#top”) 根据网搜得到的答案如下,亲测也的确如此: href="javascript:void(0)">点击: 点击链接后不会回到网页顶部 href...总结:#包含了一个位置信息默认的锚是#top 也就是网页的上端; 而javascript:void(0)仅仅表示一个死链接,没有任何信息。
这是常用的方法,但是这种方法在传递this等参数的时候很容易出问题,而且javascript:协议作为a的href属性的时候不仅会导致不必要的触发window.onbeforeunload事件,在IE...W3C标准不推荐在href里面执行javascript语句 2、 href="javascript:void(0);" onclick="js_method()>"` 这种方法是很多网站最常用的方法...,也是最周全的方法,onclick方法负责执行js函数,而void是一个操作符,void(0)返回undefined,地址不发生跳转。...综合上述,在a中调用js函数最适当的方法推荐使用:href="javascript:void(0);" onclick="js_method()"> href="javascript...3、锚 URL 此时指向页面中的锚,比如href="#top",那么点击时就会到当前页面中id="top"的这个锚点,实现当前页面的所谓跳转。
下面两种方式均无滑动效果 方法1:使用JavaScript控制 代码: href="javascript:void(0);" onclick="javascript:document.getElementsByTagName...('BODY')[0].scrollTop=document.getElementsByTagName('BODY')[0].scrollHeight;">到页底 href="javascript:void(0);" onclick="javascript:document.getElementsByTagName('BODY...')[0].scrollTop=0;">回页顶 方法2:使用html描点控制 注意此处使用的ID来查找 href="#here" >bottom//...跳到id为here的锚点 // 内容 //锚点ID 复制上述代码进入下面的链接测试效果: HTML/JS代码运行器
锚点链接是用#+对应的锚点,锚点通常用唯一属性值id设定。 图像热区链接 图像热区链接,是什么呢?...点击下方链接即可看到效果: 联系我们 代码: href="mailto:xxxxxx@qq.com">联系我们 javascript链接 点击JavaScript链接: [点击弹窗](javascript...;) 代码: href="javascript:alert('哈哈,你点击了!');">点击弹窗 空链接 空链接是指未指派目标地址的超链接。...空链接的代码: javascript: void(0)href="">href="#">href="javascript:void(0)"> 列表元素 整合列表...空元素 frame属性 属性 说明 src 需要显示的html文档 frameborder 定义框架的外边框,属性值为0或者1 scrolling 定义是否显示滚动条,有3个值:
锚点链接是用 #+对应的锚点,锚点通常用唯一属性值 id设定。 图像热区链接 图像热区链接,是什么呢?...分别是各个点的点坐标 的坐标系,原点为图片的左上角,x轴正方向向右,y轴正方向向下 我画个图哈,反映的坐标系: 图像热区链接的使用,标签定义一个image-map,...点击下方链接即可看到效果: 联系我们 代码: href="mailto:xxxxxx@qq.com">联系我们 javascript链接 点击JavaScript链接: 点击弹窗 代码:...href="javascript:alert('哈哈,你点击了!')...空链接的代码: javascript: void(0) href=""> href="#"> href="javascript:void(0)"> 列表元素
,请使用#, 因为 href="",会刷新页面,而href="#",还在这个页面,默认回到最顶部 4、锚点 作用 在页面中的某行位置处,做一个记号,方便页面能够随时跳转到记号位置处 使用方式..."javascript:JS代码块">执行JS功能 我们应该经常会看到这样的写法 href="javascript:void(0)"> void 是 JavaScript...当用户点击时,void(0) 计算为 0, Javascript 上没有任何效果,不会发生跳转。...href="#"与href="javascript:void(0)"的区别 # 包含了一个位置信息,默认的锚是#top 也就是网页的上端。...而javascript:void(0), 仅仅表示一个死链接。 6、一键拨号 href="tel:10000">点击拨号10000 7、发短信 格式:sms:手机号[,手机号][?
第一个是href=”#”,第二个是href=”javascript:void(0);”。 两种方式都设置了标签为空链接。可是两种方式还是有些不同的地方。 href=”#”。...当点击的时候会跳转到页面的顶部,相当于点击了一个锚点,在URL的后面也会出现一个#的标识符号。 而href=”javascript:void(0);”则是要运行一个javascript的表达式。...void(0)不运行也不返回不论什么东西。因此不会发生不论什么跳转。 全部设置空链接推荐用href=”javascript:void(0);” 版权声明:本文博客原创文章,博客,未经同意,不得转载。...发布者:全栈程序员栈长,转载请注明出处:https://javaforall.cn/117187.html原文链接:https://javaforall.cn
2021-02-02 18:19:38 a标签在html内使用最多的就是超链接,在href属性中加入url链接即可。...当然,他还有其他的一些功用,下面来看一下 锚点 href="#div">跳转到id="div"标签的位置 href="#">回到顶部 这个点击后会在url中增加一个hash,刷新之后依然后定位到锚点位置 拨号 href="tel:18333333333">给18333333333打电话 这种方式一般在移动端比较适用...,可以调起拨号功能 发短信 href="sms:18333333333">给18333333333发短信 这种方式同样一般在移动端比较适用,可以调起发短信功能 发邮件 href="mailto...:abc@qq.com">给abc@qq.com发邮件 这种情况需要在当前设置上安装邮件软件有效 协议限定符 这个我们用的会比较多 href="JavaScript:void(0)">不跳转或执行
路由变成了: http://biaochenxuying.cn/home 详情介绍请看:MDN 2.2 Hash 路由 我们经常在 url 中看到 #,这个 # 有两种情况,一个是我们所谓的锚点...,比如典型的回到顶部按钮原理、Github 上各个标题之间的跳转等,但是路由里的 # 不叫锚点,我们称之为 hash。...='javascript:void(0);' onclick='linkTo(\"#/list\")'>列表内容占位"...='javascript:void(0);' onclick='linkTo(\"#/detail\")'>详情" document.querySelector...='javascript:void(0);' onclick='linkTo(\"#/detail\")'>详情" document.querySelector
submit),不必要的表单提交 5、js中变量的合理利用 6、href="javascript:;" 和 href=""以及href="#"的区别: "#"包含了一个位置信息,默认的锚点是#top...a href ="" 默认打开的还是当前页面,会刷新一下重新打开。 ...而javascript:void(0) 仅仅表示一个死链接 这就是为什么有的时候页面很长浏览链接明明是#可是跳动到了页首, 而javascript:void(0) 则不是如此,所以调用脚本的时候最好用...void(0) 注意点:要执行某些处理,但是不整体刷新页面的情况下,可以使用void (0),但是在需要对页面进行refresh的情况下 7、window.onload = function...3、使用包含选择器时,会包含祖先元素在内。
解决方案: 把href="javascript:void(0);"去掉即可!...为什么要使用href=”javascript:void(0);”? javascript:是伪协议,表示url的内容通过javascript执行。...href="javascript:void(0)" onClick="window.open()"> 点击链接后,页面不动,只打开链接 href=”javascript:void(0);”与href...例如默认的锚点是#top 也就是网页的上端 而javascript:void(0) 仅仅表示一个死链接这就是为什么有的时候页面很长浏览链接明明是#可是跳动到了页首 而javascript:void(...0) 则不是如此所以调用脚本的时候最好用void(0) 使用javascript的方法 href="#" onclick="javascript:方法;return false;">文字
我们经常会使用到 javascript:void(0) 这样的代码,那么在 JavaScript 中 javascript:void(0) 代表的是什么意思呢?...document.write('a = ' + a + ' b = ' + b +' c = ' + c ); } href="#"与href="javascript:void(0)"的区别 # 包含了一个位置信息...而javascript:void(0), 仅仅表示一个死链接。 在页面很长的时候会使用 # 来定位页面的具体位置,格式为:# + id。...如果你要定义一个死链接请使用 javascript:void(0) 。 实例 href="javascript:void(0);">点我没有反应的!... href="#pos">点我定位到指定位置! ... 尾部定位点
( HTML5 中的新属性) 注意: 如果不使用href属性,则不可以使用如下属性:download,hreflang,media,rel,target以及type属性。...空链接: href=””>空链接 href=”javascript:void(0)”>我是JavaScript空链接也叫死链接...单击后没有反应,可以配合JS程序 href=”javascript:void(0)” onclick=”alert(‘点我啊!!’)”...地址”>联系我们 点击这个链接就会自动启动Micosoft office outlook向email发送邮件 锚点链接: 先定义锚点:...使用方法: href=”#top”>回到TOP位置 2、表格结构 标签定义 HTML 表格。
【1】使用默认链接锚点 添加一个a链接,设置a链接的href属性值为”#top”即可实现 我在顶部 href="#goTop">返回顶部 【3】使用自定义链接锚点 在页面顶部定义一个锚点,然后将返回顶部a链接的href属性指向该锚点 href="#goTop">返回顶部 【4】使用简单的JavaScript脚本 设置scrollTo(x,y)中的x和y的坐标值来滚动到页面的具体位置...-- 很多内容 --> href="javascript:window.scrollTo(0,0)">返回顶部 【5】使用简单的jQuery实现 1 javascript" src="js/jquery.min.js"> 2 javascript"> 3
默认行为 a标签点击跳转 标签在href存在的情况下会点击自动跳转链接或者定位锚点,通过对的监听事件阻止默认行为后,点击链接不会跳转。...href="https://blog.touchczy.top" id="t1">点击跳转链接 javascript"> document.getElementById...IE8及之前的浏览器阻止默认行为需要使用window.event.returnValue = false。 直接在事件处理函数中return false也能阻止默认行为,只在DOM0级模型中有效。...此外,在jQuery中使用return false会同时阻止默认行为与事件传播。 示例代码 html> html> 默认行为及阻止 href="https://blog.touchczy.top
最近对模板更新时用到了这一点,举例说一下 // a.html href="#one">点击跳转到第一个锚点 href="b.html#two">点击跳转到第二个锚点 // a.html...一般情况下,我们会在目标节点上添加id属性或者name属性,这个id或者name属性的值就是我们寻找锚点的依据,推荐使用id属性来标记锚点(因为id能够在各种标签上使用,name属性标记锚点时只能用在a...标签上) 需要一个触发锚点跳转的a标签。...a标签一般用作定义超链接,用作超链接时它的href属性的值是另一个页面的URL。a标签用作锚点时,href的值是锚点的id值或者name值。...同一页面内的锚点跳转时,给href赋值# + 锚点id的值或者# + 锚点name的值,需要跳转其他页面的锚点位置时,需要在#前面加上跳转的路径,例如:href="b.html#two"
但与a标签的href属性不同的是,use href不能使用JavaScript伪协议,但可以使用data:协议。...://www.w3.org/1999/xlink' width='100' height='100'>href='javascript:alert(1)'>0' y=...'0' width='100' height='100' />#x"> data协议中的文件必须是一个完整的svg,而且整个data URL的末尾,需要有一个锚点...但这里要注意的是,URL锚点#x是在编码外的,不能把这部分编码进base64,否则无法引用成功。...0x06 总结 总结一下,Tui Editor的Viewer使用自己编写的HTML sanitizer来过滤Markdown渲染后的HTML,而这个sanitizer使用了很经典的先设置DOM的innerHTML
最近对模板更新时用到了这一点,举例说一下 复制代码 // a.html href="#one">点击跳转到第一个锚点 href="b.html#two">点击跳转到第二个锚点...一般情况下,我们会在目标节点上添加id属性或者name属性,这个id或者name属性的值就是我们寻找锚点的依据,推荐使用id属性来标记锚点(因为id能够在各种标签上使用,name属性标记锚点时只能用在a...标签上) 需要一个触发锚点跳转的a标签。...a标签一般用作定义超链接,用作超链接时它的href属性的值是另一个页面的URL。a标签用作锚点时,href的值是锚点的id值或者name值。...同一页面内的锚点跳转时,给href赋值# + 锚点id的值或者# + 锚点name的值,需要跳转其他页面的锚点位置时,需要在#前面加上跳转的路径,例如:href="b.html#two"
8、纯CSS的导航栏Tab切换方案 不用 Javascript,使用纯 CSS 方案,实现类似下图的导航栏切换: ?...:123456 列表2内容:abcdefgkijkl 由于要使用 :target,需要 HTML 锚点,以及锚点对应的 HTML 片段。...="#content1"> 中的锚点 #content1 就对应了列表1 。...锚点2与之相同对应列表2。..., #content2:target{ display:block; } 上面的 CSS 代码,一开始页面中的 #content1 与 #content2 都是隐藏的,当点击列表1触发href=
一些需要注意的地方: hash 指地址中 # 以及后面的字符,也叫散列值 也叫 锚点,本身是用来做页面跳转定位的,如 https://cellinlab.xyz/#/home 的 hash 即 #/home...href 可以设置为页面的元素 ID 如 #top,当点击链接时页面跳转到该 ID 元素所在区域,同时浏览器自动设置 window.location.hash 属性,地址栏中的哈希值也会发生变化,并触发...'); console.log(history.state); // { foo: 'bar' } 注意:如果 pushState 的 URL 参数设置了一个新的锚点值(即 hash),并不会触发...相反,如果 URL 的锚点值变了,会在 History 对象创建一条浏览记录。...popstate 事件 仅仅调用 pushState() 方法或 replaceState() 方法,并不会触发该事件 只有用户点击浏览器倒退按钮或前进按钮,或者使用 JavaScript 调用 history.back
领取专属 10元无门槛券
手把手带您无忧上云