Jquery笔记01

Jquery笔记01

jQuery是一个JS库 其中的 $ 就是一个函数
如果传入一个匿名函数,就是入口函数, 在DOM树加载完成后会立即执行。(类似于window.onload()

 $(function () {

        })

如果传入一个DOM对象,会转换成JQuery对象 $(Dom对象)
jQuery方法必须用jQuery对象调用!

text()方法:

$(box).text();

传入一个选择器形式字符串,会获取元素对应的对象,并包装成jQuery对象

$('.test p')

多个会返回伪数组
0: 对象1
1: 对象2

jQuery对象是DOM对象的包装集

筛选选择器:(是方法)

$('#box').children('选择器 (若省略则返回所有的子元素伪数组)');//常用
$('#box').find('选择器') //相当于后代选择器
$('#box').siblings('选择器(传回符合要求的所有兄弟,不传参数返回所有兄弟)')

注册事件

$('.box').mouseenter(function () {
            $(this).children('ul').show();//this 返回dom对象
        })
//注意与webAPI区分,在jquery中不带on,直接就是mouseenter / click 等
$('.box').mouseleave(function () {
    $(this).children('ul').hide();//this 返回dom对象,所以用$包装
})
$('li').eq(2); //找li里面的第3个对象(下标为2),返回jquery对象。
$('li').eq(2).next();//找li里面的第4个对象,返回jquery对象
$('li').eq(2).next().index();//返回元素的对应下标

index()详解

$(selector).index(element) ;

获得element相对于selector的 index 位置。该元素可以通过 DOM 元素或 jQuery 选择器来指定。

$(selector).index();//找自己在自己组的下标,与其他组无关
$(this).css('bacgroundColor','pink').siblings().css('backgroundColor' , '');
 $(this).css('bacgroundColor' , 'pink')//返回的是jQuery对象

JQ的链式语法,可以很方便的进行系列的操作,

$(this).children('div').show().parent().siblings().children('div').hide();
$(this).children('div') //返回的是点击的 div
$(this).children('div').show() //返回的还是这个 div

jQuery对象转换为DOM对象##:

($(selector)).get(index);
($(selector))[0];

不常用的一些方法:

$('li:odd')//返回奇数
$('li:event')//返回偶数
$('li:eq(2)')//返回下标为2的

猜你喜欢

转载自blog.csdn.net/KempRong/article/details/80343671