jquery地址栏链接与a标签链接匹配之特效代码总结

如题所述，当出现这样的功能，点击某个链接后，给跳转后的该链接地址添加样式，通过添加class为current来增加特殊样式。

如图所示：点击HTML+css3跳转后，给其添加如图样式：

js代码如下：

var currUrl = window.location.href;
   var currStyle = function (links){
     links.each(function(){
        var url = $(this).attr('href');
        if (currUrl.indexOf(url) != -1){
          $(this).addClass("current");
          return false;
        }
     });
}

怎样调用呢？

如下jquery调用代码：

$(function(){
  currStyle($("#sidebar .list a"));
})

这样就实现了如图所示的功能。

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

javascript代码如下:

document.getElementById("myId").setAttribute("href","www.xxx.com");
document.getElementById("myId").href = "www.xxx.com";

jquery:代码如下:

$("#myId").attr("href","www.xxx.com");

以上内容就是本文的全部内容，希望大家喜欢。

赞 (0)

相关推荐

  • javascript/jquery获取地址栏url参数的方法

    使用jquery获取url以及使用jquery获取url参数是我们经常要用到的操作 1.jquery获取url很简单,代码如下 复制代码 代码如下: window.location.href; 其实只是用到了javascript的基础的window对象,并没有用jquery的知识 2.jquery获取url参数比较复杂,要用到正则表达式,所以学好javascript正则式多么重要的事情 首先看看单纯的通过javascript是如何来获取url中的某个参数 复制代码 代码如下: function

  • 使用JS或jQuery模拟鼠标点击a标签事件代码

    复制代码 代码如下: <a id="alink" href="abc.aspx" style="visibility: hidden;">下一步</a> $("#alink").click(); // 触发了a标签的点击事件,但是没有触发页面跳转 document.getElementById("alink").click(); //既触发了a标签的点击事件,又触发了页面跳转 把 &

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

    onclick中javascript的区别一般没用到都没注意,但出错时才有些郁闷,看文本章解释如下: 以前一直很随意,后来看.net里的linkbutton似乎是用在<a href="javascript:fun();"...>的形式,今天用这种方式就遇到一些问题,摘网友的文章和我的结论放在下面: 1.链接的 onclick 事件被先执行,其次是 href 属性下的动作(页面跳转,或 javascript 伪链接): 2.假设链接中同时存在 href 与 onclick,如

  • php将url地址转化为完整的a标签链接代码(php为url地址添加a标签)

    需要提取的内容如下: 复制代码 代码如下: <a href="http://baidu.com">http://baidu.com</a>这是第一个A标签,<a href="http://blog.baidu.com">成长脚印-专注于互联网发展</a>这是第二个A标签.http://www.jb51.net这是第一个需要被提取的URL地址,http://blog.baidu.com这是第二个需要被提取的URL地址'.

  • jQuery获取地址栏参数插件(模仿C#)

    复制代码 代码如下: $.request = (function () { var apiMap = {}; function request(queryStr) { var api = {}; if (apiMap[queryStr]) { return apiMap[queryStr]; } api.queryString = (function () { var urlParams = {}; var e, d = function (s) { return decodeURICompon

  • 实现网页页面跳转的几种方法(meta标签、js实现、php实现)

    1.meta标签实现 只需在head里加上下面这一句就行了,在当前页面停留0.1秒后跳转到目标页面 复制代码 代码如下: <meta http-equiv="refresh" content="0.1; url=http://jb51.net/"> 2.Javascript实现 方法一: 这个方法比较常用 复制代码 代码如下: window.location.href = "http://jb51.net/"; 方法二: 复制代码 代

  • jquery通过a标签删除table中的一行的代码

    复制代码 代码如下: <tr> <td width="10%"> <s:property value="#owner.id" /> </td> <td width="20%"> <s:property value="#owner.name" /> </td> <td width="15%"> <s:prop

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

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

  • jquery trigger伪造a标签的click事件取代window.open方法

    var ohtml='<div class="friend-dialog tac pt15 pb20">'+ '<div class="f-h32">您已经成功发送好友申请.</div>'+ ' <p class="c999">上传真实头像,好友申请更容易被通过哦,赶紧上传头像吧!</p> '+ '<a href="<%=path%>/teacher/edit

  • 基于jquery的地址栏射击游戏代码

    基于jquery的地址栏射击游戏代码

    演示地址:http://demo.jb51.net/js/2011/hunt/index.htm玩法向下看 请看地址栏上的字母 O! 你使用O来向 a射击. 使用键盘上的 左箭头 和 右箭头 移动字母O. 当O移动到 a 上时,按 空格键射击! 游戏会定时30秒时间,按ESC键重新开始. 注:请使用系统自带的IE浏览器来打开本链接. 你使用O来向 a射击. 使用键盘上的 左箭头 和 右箭头 移动字母O. 当O移动到 a 上时,按 空格键射击! // // 核心代码: 复制代码 代码如下: (fu

  • jquery 为a标签绑定click事件示例代码

    $(document).ready(function() { $("a[name='del']").click(function(){ Ext.Msg.confirm('提示','你确定要删除该公告吗?',function(button,text){ if(button=='yes'){ window.location.href="/admin/note!delete.action?id=${id}"; } }); }); $("a[class='del2

随机推荐