jquery最快速入门文档
生活随笔
收集整理的這篇文章主要介紹了
jquery最快速入门文档
小編覺得挺不錯的,現在分享給大家,幫大家做個參考.
<!DOCTYPE html>
jQuery
選擇器
1. id
$('#id')
class
<div class="c1"></div>
$(".c1")
標簽
<div class="c1">
<a>f</a>
<a>f</a>
</div>
<div class="c1">
<a>f</a>
</div>
<div class="c2"></div>
$("a")
組合
<div class="c1">
<a>f</a>
<a>f</a>
</div>
<div class="c1">
<a>f</a>
</div>
<div class="c2"></div>
<div id="i10"></div>
$("a")
$('a,.c2,#i10')
層級
<div id="i10' class="c1">
<a>f<a>
<div><a>f<a></div>
</div>
$('#i10 a')子子孫孫都找到
$('#i10>a')兒子
基本
：first
：last
:eq()
7.屬性
$('[wj]') 具有wj屬性的所有標簽
$('[wj="wangjian"]') wj屬性等于wangjian的標簽
$("input[type='text']")==$(':text')
jQuery方法內置循環： ￥（’#tb:checkbox').xxxx
$('#tb:checkbox').each(function(k){
//k當前索引
//this.Dom,當前循環的元素
}
var v = 條件 ? 真值 : 假值
篩選器
$(this).next();獲取當前標簽的下一個標簽$(this).nextAll();獲取當前后的所有標簽
$('#i1').nextUntil('#ii1');獲取從#i1的標簽到#ii1的標簽
$(this).prev();獲取當前標簽的上一個標簽
$(this).prevAll();獲取當前標簽以前的所有標簽
$('#i1').prevUntil('#ii1');獲取從#i1的標簽到#ii1的標簽
$(this).parent();獲取當前標簽的父標簽
$('#i1').parents()
$('#i1').parentsUntil()
$(this).children();獲取當前標簽的子標簽
$(this).siblings();獲取當前標簽的所有兄弟標簽
$(this).find('.class/#id');在當前標簽下子標簽中找符合條件的標簽
給標簽添加刪除樣式
$(this).addClass('樣式')
$(this).removeClass('樣式')
first()
last()
hasClass('樣式')
文本操作
$(..).text() # 獲取文本內容$(..).text(“<a>1</a>”) # 設置文本內容
$(..).html()
$(..).html("<a>1</a>")
$(..).val()
$(..).val(..)
$(..).val(..)
樣式操作：
addClassremoveClass
toggleClass
屬性操作：
專們用于做自定義屬性$(..).attr('n')
$(..).attr('n','v')
$(..).removeAttr('n')
<input type='checkbox' id='i1' />
專們用于chekbox,radio
$(..).prop('checked')
$(..).prop('checked', true)
PS:
index 獲取索引位置
文本操作
appendprepend
after
before
remove
empty
clone
css處理
$('t1').css('樣式名稱', '樣式值')點贊：
- $('t1').append()
- $('t1').remove()
- setInterval
- 透明度 1 》 0
- position
- 字體大小，位置
位置
$(window).scrollTop()獲取$(window).scrollTop(0)設置
$('div').scrollTop()獲取div滑動高度
scrollLeft([val])與scrollTop作用相同
offset().left 指定標簽在html中的坐標
offset().top 指定標簽在html中的坐標
position() 指定標簽相對父標簽(relative)標簽的坐標
<div style='relative'>
<div>
<div id='i1' style='position:absolute;height:80px;border:1px'></div>
</div>
</div>
$('i1').height() # 獲取標簽的高度 純高度
$('i1').innerHeight() # 獲取邊框 + 純高度 + ？
$('i1').outerHeight() # 獲取邊框 + 純高度 + ？
$('i1').outerHeight(true) # 獲取邊框 + 純高度 + ？
純高度，邊框，外邊距，內邊距
事件
Dom:三種綁定方式jQuery:
$('.c1').click()
$('.c1')....好多事件，去掉了on
$('.c1').bind('click',function(){})
$('.c1').unbind('click',function(){})
$('.c').delegate('a','click',function(){})
$('.c').undelegate('a','click',function(){})
$('.c1').on('click',function(){})
$('.c1').off('click',function(){})
阻止事件發生
return false阻止后面的事件發生，把事件攔截住當頁面框架加載完成之后，自動執行
$(function(){$(...)
})
jQuery擴展
第一種擴展$.extend({'wj':function(){return 'nb';}})
var v=$.wj();
alert(v);
第二種擴展
$.fn.extend({'wj':function(){return nb}});
var v=$('#i1').wj();*必須有標簽選擇器
alert(v)
第三種
(function(arg){
var status=1;
//封裝變量
arg.extend({'wj':function(){ return 'nb';}});
})(jQuery/$)
轉載于:https://www.cnblogs.com/dcotorbool/p/8508491.html
總結
以上是生活随笔為你收集整理的jquery最快速入门文档的全部內容，希望文章能夠幫你解決所遇到的問題。
- 上一篇： 某考试 T2 Tree
- 下一篇： 【XSY2111】Chef and Ch