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


Posted in Javascript onAugust 24, 2015

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

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

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

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");

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

Javascript 相关文章推荐
javascript运行机制之this详细介绍
Feb 07 Javascript
jQuery实现的Div窗口震动特效
Jun 09 Javascript
jquery和js实现对div的隐藏和显示方法
Sep 26 Javascript
20分钟轻松创建自己的Bootstrap站点
May 12 Javascript
浅谈js构造函数的方法与原型prototype
Jul 04 Javascript
underscore之function_动力节点Java学院整理
Jul 11 Javascript
JS实现身份证输入框的输入效果
Aug 21 Javascript
详解vue2.0 不同屏幕适配及px与rem转换问题
Feb 23 Javascript
swiper 自动图片无限轮播实现代码
May 21 Javascript
使用json-server简单完成CRUD模拟后台数据的方法
Jul 12 Javascript
详解如何用typescript开发koa2的二三事
Nov 13 Javascript
jquery实现弹窗(系统提示框)效果
Dec 10 jQuery
jquery实现鼠标滑过显示二级下拉菜单效果
Aug 24 #Javascript
js实现的简洁网页滑动tab菜单效果代码
Aug 24 #Javascript
jquery+html5烂漫爱心表白动画代码分享
Aug 24 #Javascript
jquery+CSS实现的多级竖向展开树形TRee菜单效果
Aug 24 #Javascript
jQuery超酷平面式时钟效果代码分享
Mar 30 #Javascript
jquery实现可横向和竖向展开的动态下滑菜单效果
Aug 24 #Javascript
jQuery支持添加事件的日历特效代码分享(3种样式)
Aug 24 #Javascript
You might like
PHP include_path设置技巧分享
2011/07/03 PHP
九个你必须知道而且又很好用的php函数和特点
2013/08/08 PHP
PHP中exec与system用法区别分析
2014/09/22 PHP
PHP生成json和xml类型接口数据格式
2015/05/17 PHP
Gambit vs ForZe BO3 第三场 2.13
2021/03/10 DOTA
JScript中使用ADODB.Stream判断文件编码的代码
2008/06/09 Javascript
动态修改DOM 里面的 id 属性的弊端分析
2008/09/03 Javascript
JavaScript 常用函数
2009/12/30 Javascript
input输入框鼠标焦点提示信息
2015/03/17 Javascript
关于js里的this关键字的理解
2015/08/17 Javascript
Json解析的方法小结
2016/06/22 Javascript
js改变style样式和css样式的简单实例
2016/06/28 Javascript
JavaScript获取URL中参数querystring的方法详解
2016/10/11 Javascript
基于Layer+jQuery的自定义弹框
2020/05/26 Javascript
Ionic + Angular.js实现验证码倒计时功能的方法
2017/06/12 Javascript
jQuery实现选中行变色效果(实例讲解)
2017/07/06 jQuery
js实现拖拽上传图片功能
2017/08/01 Javascript
three.js实现3D模型展示的示例代码
2017/12/31 Javascript
vue源码中的检测方法的实现
2019/09/26 Javascript
element el-tree组件的动态加载、新增、更新节点的实现
2020/02/27 Javascript
小程序分享链接onShareAppMessage的具体用法
2020/05/22 Javascript
Python实现在matplotlib中两个坐标轴之间画一条直线光标的方法
2015/05/20 Python
Python的Django框架中settings文件的部署建议
2015/05/30 Python
Python解析json时提示“string indices must be integers”问题解决方法
2019/07/31 Python
python 字典有序并写入json文件过程解析
2019/09/30 Python
使用python matploblib库绘制准确率,损失率折线图
2020/06/16 Python
HTML5使用DOM进行自定义控制示例代码
2013/06/08 HTML / CSS
香港草莓网土耳其网站:Strawberrynet TR
2017/03/02 全球购物
Ariat英国官网:为世界顶级马术运动员制造最优质的鞋类和服装
2020/02/14 全球购物
学生手册家长评语
2014/02/10 职场文书
公司合作意向书范文
2014/07/30 职场文书
党员四风自我剖析材料思想汇报
2014/09/13 职场文书
2014年班主任德育工作总结
2014/12/05 职场文书
公司车辆管理制度
2015/08/04 职场文书
《全神贯注》教学反思
2016/02/22 职场文书
Windows 11上手初体验:任务栏和开始菜单等迎来大改
2021/11/21 数码科技