了解了这些才能开始发挥jQuery的威力

2020-05-23 06:15:57易采站长站整理


.find(selector) 查找集合每个元素的子节点


Get the descendants(子节点) of each element in the current set of matched elements, filtered by a selector, jQuery object, or element.


$(‘li.item-ii’).find(‘li’).css(‘background-color’, ‘red’);


.filter(selector) 过滤当前集合内元素


Reduce(减少) the set of matched elements to those that match the selector or pass the function’s test.


$(‘li’).filter(‘:even’).css(‘background-color’, ‘red’);


基本方法


.ready(handler) 文档加载完成后执行的方法,区别于window.onload


Specify a function to execute when the DOM is fully loaded.



$(document).ready(function() {
  // Handler for .ready() called.
});


.each(function(index,element)) 遍历集合内每个元素


Iterate over a jQuery object, executing a function for each matched element.



$(“li” ).each(function( index ) {
  console.log( index + “: ” + $(this).text() );
});


jQuery.extend( target [, object1 ] [, objectN ] ) 合并对象


Merge the contents of two or more objects together into the first object.


var object = $.extend({}, object1, object2);


获取元素


.eq(index) 按index获取jQuery对象集合中的某个特定jQuery对象


Reduce the set of matched elements to the one at the specified index.


.eq(-index) 按逆序index获取jQuery对象集合中的某个特定jQuery对象


An integer indicating the position of the element, counting backwards from the last element in the set.


$( “li” ).eq( 2 ).css( “background-color”, “red” );
 


.get(index) 获取jQuery集合对象中某个特定index的DOM对象(将jQuery对象自动转换为DOM对象)


Retrieve one of the DOM elements matched by the jQuery object.


console.log( $( “li” ).get( -1 ) );


.get() 将jQuery集合对象转换为DOM集合对象并返回


Retrieve the DOM elements matched by the jQuery object.


console.log( $( “li” ).get() );
.index() / .index(selector)/ .index(element) 从给定集合中查找特定元素index


Search for a given element from among the matched elements.


1. 没参数返回第一个元素index


2.如果参数是DOM对象或者jQuery对象,则返回参数在集合中的index


3.如果参数是选择器,返回第一个匹配元素index,没有找到返回-1



var listItem = $( “#bar” );
alert( “Index: ” + $( “li” ).index( listItem ) );