JQuery 总结（6） 锋利的jQuery
1.解決 jQuery 和其他庫(kù)的沖突
定義了一個(gè)快捷鍵，以后 碰到$的 可以用新的替代，jQuery.noConflict(); 表示轉(zhuǎn)移$控制權(quán)
| 1 2 3 4 5 6 7 8 9 | //?省略其他代碼 var $j = jQuery.noConflict(); //自定義一個(gè)快捷方式 $j(function(){ //使用 jQuery，利用自定義快捷方式 — $j $j("p").click(function(){ alert( $j(this).text() ); }) }) $("pp").style.display = 'none'; //使用 prototype.js 隱藏元素 //?省略其他代碼 |
2.jQuery 檢查某個(gè)元素是否存在
?有時(shí)候要用作if判斷語(yǔ)句，如果存在 執(zhí)行什么 如果不存在 點(diǎn)擊哪個(gè)按鈕
?
if($("#hh")[0]){
console.log(1)
}else{
console.log(2)
$("#chh").click()
}
?
?
| 1 2 3 | if ($("span")[0]){ ???$("div").css("background","red") ??} |
3.鼠標(biāo)指示 顯示title
? ? ?鼠標(biāo)覆蓋 創(chuàng)建一個(gè)標(biāo)簽，然后插入標(biāo)簽，把前面的title值 用東西存起來(lái)，清空他的title值，當(dāng)鼠標(biāo)移開的時(shí)候再給他賦值回去。
| 1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 | <body> <p><a?href="#" class="tooltip" title="這是我的超鏈接提示 1.">提示 1.</a></p> <p><a?href="#" class="tooltip" title="這是我的超鏈接提示 2.">提示 2.</a></p> <p><a?href="#" title="這是自帶提示 1.">自帶提示 1.</a> </p> <p><a?href="#" title="這是自帶提示 2.">自帶提示 2.</a> </p> <script> ??$(".tooltip").mouseover(function (e) { ?????this.myTitle = this.title; ?????this.title = ""; ????var? newt="<div?id='tooltip'>"+this.myTitle+"</div>"; ????$("body").append(newt); ????console.log(e.pageX ) ????$("#tooltip").css({ ??????"top": e.pageY +10+ "px", ??????"left": e.pageX+10 + "px", ??????"position":"absolute" ????}) ??}).mouseout(function () { ???$("#tooltip").remove(); ???this.title = this.myTitle; ??}) </script> </body> |
?4.jQuery置頂
? ??οnclick=$(window).scrollTop(0);
| 1 2 3 4 5 | $(".yb_top").click(function() { $("html,body").animate({ 'scrollTop': '0px' }, 300) }); |
5.scroll
6.判斷
?activeText? =? activeText == "左邊" ? "左邊1111" : 5555;?
判斷activeText == "左邊" 是否成立? 如果成立 走前面? 左邊1111，不成立 就走后面
? ??
7.菜單折疊效果
| 1 | $(this).siblings().toggle(500).parent().siblings().children("p").slideUp(200); |
總結(jié)
以上是生活随笔為你收集整理的JQuery 总结（6） 锋利的jQuery的全部?jī)?nèi)容，希望文章能夠幫你解決所遇到的問(wèn)題。
- 上一篇： JQuery 总结（5） 总结各种小应
- 下一篇： JQuery 总结（7） index()