JQuery 总结(6) 锋利的jQuery
1.解決 jQuery 和其他庫的沖突
定義了一個快捷鍵,以后 碰到$的 可以用新的替代,jQuery.noConflict(); 表示轉移$控制權
| 1 2 3 4 5 6 7 8 9 | //?省略其他代碼 var $j = jQuery.noConflict(); //自定義一個快捷方式 $j(function(){ //使用 jQuery,利用自定義快捷方式 — $j $j("p").click(function(){ alert( $j(this).text() ); }) }) $("pp").style.display = 'none'; //使用 prototype.js 隱藏元素 //?省略其他代碼 |
2.jQuery 檢查某個元素是否存在
?有時候要用作if判斷語句,如果存在 執行什么 如果不存在 點擊哪個按鈕
?
if($("#hh")[0]){
console.log(1)
}else{
console.log(2)
$("#chh").click()
}
?
?
| 1 2 3 | if ($("span")[0]){ ???$("div").css("background","red") ??} |
3.鼠標指示 顯示title
? ? ?鼠標覆蓋 創建一個標簽,然后插入標簽,把前面的title值 用東西存起來,清空他的title值,當鼠標移開的時候再給他賦值回去。
| 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); |
總結
以上是生活随笔為你收集整理的JQuery 总结(6) 锋利的jQuery的全部內容,希望文章能夠幫你解決所遇到的問題。
- 上一篇: JQuery 总结(5) 总结各种小应
- 下一篇: JQuery 总结(7) index()