快捷導(dǎo)航

jquery地址欄鏈接與a標(biāo)簽鏈接匹配之特效代碼總結(jié)

更新時(shí)間：2015年08月24日 16:11:36 作者：風(fēng)雨后見彩虹

jquery如何獲取地址欄參數(shù)，改變地址欄樣式，接下來(lái)，通過(guò)本篇文章給大家分享jquery地址欄鏈接與a標(biāo)簽鏈接匹配之特效代碼總結(jié)，需要的朋友可以參考下

如題所述，當(dāng)出現(xiàn)這樣的功能，點(diǎn)擊某個(gè)鏈接后，給跳轉(zhuǎn)后的該鏈接地址添加樣式，通過(guò)添加class為current來(lái)增加特殊樣式。

如圖所示：點(diǎn)擊HTML+css3跳轉(zhuǎn)后，給其添加如圖樣式：

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

怎樣調(diào)用呢？

如下jquery調(diào)用代碼：

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

這樣就實(shí)現(xiàn)了如圖所示的功能。

javascript和jquery修改a標(biāo)簽的href屬性

javascript代碼如下:

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

jquery:代碼如下:

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

以上內(nèi)容就是本文的全部?jī)?nèi)容，希望大家喜歡。

您可能感興趣的文章:

相關(guān)文章

基于jQuery實(shí)現(xiàn)拖拽圖標(biāo)到回收站并刪除功能
這篇文章主要介紹了基于jQuery實(shí)現(xiàn)拖拽圖標(biāo)到回收站并刪除功能，實(shí)現(xiàn)非常簡(jiǎn)單，我們直接可以利用jQuery內(nèi)部封裝的拖拽接口即可簡(jiǎn)單實(shí)現(xiàn)在網(wǎng)頁(yè)上拖拽任意元素的功能，感興趣的小伙伴們可以參考一下
2015-11-11
判斷文檔離瀏覽器頂部的距離的方法
文檔離瀏覽器頂部的距離如何判斷，下面有個(gè)不錯(cuò)的方法，感興趣的朋友可以參考下
2014-01-01
jquery復(fù)選框checkbox實(shí)現(xiàn)刪除前判斷
頁(yè)面有很多數(shù)據(jù)，可以刪除一條或多條，刪除前判斷是否選中至少一條，否則提示，具體示例如下，需要的朋友可以參考下
2014-04-04
jQuery插件Skippr實(shí)現(xiàn)焦點(diǎn)圖幻燈片特效
Skippr 是一個(gè)超級(jí)簡(jiǎn)單的 jQuery 幻燈片插件。只是包括你的網(wǎng)頁(yè)中引入 jquery.skippr.css 和 jquery.skippr.js 文件就能使用了。Skippr 能夠自適應(yīng)窗口寬度，而且導(dǎo)航是獨(dú)特的條形導(dǎo)航。
2015-04-04
jQuery實(shí)現(xiàn)帶玻璃流光質(zhì)感的手風(fēng)琴特效
這篇文章主要介紹了jQuery實(shí)現(xiàn)帶玻璃流光質(zhì)感的手風(fēng)琴特效，是一款基于jQuery+CSS3實(shí)現(xiàn)手風(fēng)琴特效，希望你可以喜歡。
2015-11-11
jquery sortable的拖動(dòng)方法示例詳解
本文以示例的方式為大家介紹下jquery sortable的拖動(dòng)方法的具體實(shí)現(xiàn)，感興趣的朋友可以參考下
2014-01-01
使用ajaxfileupload.js實(shí)現(xiàn)ajax上傳文件php版
這篇文章主要介紹了使用ajaxfileupload.js實(shí)現(xiàn)ajax上傳文件php版,需要的朋友可以參考下
2014-06-06
jQuery中ajax獲取數(shù)據(jù)賦值給頁(yè)面的實(shí)例
下面小編就為大家分享一篇jQuery中ajax獲取數(shù)據(jù)賦值給頁(yè)面的實(shí)例，具有很好的參考價(jià)值，希望對(duì)大家有所幫助。一起跟隨小編過(guò)來(lái)看看吧
2017-12-12
基于JQuery實(shí)現(xiàn)圖片上傳預(yù)覽與刪除操作
這篇文章主要為大家詳細(xì)介紹了基于JQuery實(shí)現(xiàn)圖片上傳預(yù)覽與刪除操作的相關(guān)代碼，感興趣的小伙伴們可以參考一下
2016-05-05
Jquery iframe內(nèi)部出滾動(dòng)條
Jquery 操作頁(yè)面中iframe自動(dòng)跟隨窗口大小變化，而不出現(xiàn)滾動(dòng)條，只在iframe內(nèi)部出滾動(dòng)條
2010-02-02