js jQuery取消添加超链接的方法小结
今天在工作中需要将某个链接给取消实现只触发事件的目的,后来发现批量取消链接等,脚本之家简单的给整理了下,希望对需要的朋友有所帮助。
单个链接取消链接并触发js事件
<a href="javascript:void(0);" onclick="alert('ok')">测试</a>
批量将网页中的链接取消或重新设置链接的代码:
1 2 <A href="http://www.baidu.com" >百度</A> <A href="http://www.jb51.net" >脚本之家</A> 3 <A href="http://s.jb51.net" >服务器软件</A> <A href="http://sc.jb51.net" > 素材下载</A> 4 <A href="http://tools.jb51.net" >站长查询</A> <A href="http://www.jb51.net/jiaoben/" >脚本下载</A> 5 <input type=button id=o1 value="取消所有链接" onclick="javascript:doLinkAll(false)"> 6 <input type=button id=o2 value="重新设置链接" onclick="javascript:doLinkAll(true)"> 7 <script> 8 function doLinkAll(action){ 9 var arr=document.getElementsByTagName("A") 10 for(var i=0;i <arr.length;i++){ 11 if (action){ //重新设置链接 12 if (arr[i].rel) arr[i].setAttribute("href",arr[i].rel) 13 }else{ //取消所有链接 14 arr[i].setAttribute("rel",arr[i].href) 15 arr[i].removeAttribute("href") 16 } 17 } 18 o1.disabled=!action 19 o2.disabled=action 20 } 21 </script>
如果想让指定id的链接字取消或恢复链接可以参考下面的代码
1 var e=document.getElementById( "link1 ") 2 //设置 3 e.setAttribute( "href ",e.rel) 4 //取消 5 e.setAttribute( "rel ",e.href) 6 e.removeAttribute( "href ")
代码说明:为什么取消需要加上e.setAttribute( "rel ",e.href) ,这段代码就是为a增加一个rel熟悉并设置好链接,方便后来的恢复链接。
js方法原文来自:http://www.jb51.net/article/28500.htm
jQuery方法:
取消链接:
jQuery代码:
1 <script type="text/javascript" src="http://www.codefans.net/ajaxjs/jquery1.3.2.js"></script> 2 3 <script type="text/javascript"> 4 $(document).ready(function() { 5 $(".cont a").removeAttr("href") 6 }); 7 8 </script>
html代码:
1 <div class="cont"> 2 <a href="http://www.baidu.com">内容</a> 3 4 </div>
添加链接实现:
jQuery代码:
1 <script type="text/javascript" src="http://www.codefans.net/ajaxjs/jquery1.3.2.js"></script> 2 3 <script type="text/javascript"> 4 $(document).ready(function() { 5 6 var strA = "<a href='http://www.baidu.com'></a>"; 7 $(".cont").wrapInner(strA); 8 9 10 11 }); 12 13 </script>
html代码:
1 <div class="cont"> 2 内容 3 4 </div>