jQuery commonly used API
1: jQuery selector
$("Selector") // Write the CSS selector directly in the selector, but add quotation marks
Attributes | description | use |
---|---|---|
ID selector | Get the element with the specified ID | $("#id") |
Select all selector | Match all elements | $("*’’) |
Class selector | Get elements of the same class | $(".class") |
Label selector | Get all elements of the same type of label | $(“div”) |
Union selector | Select multiple elements | s(“div,p,li”) |
Intersection selector | Intersection element | $(“Ii.current”) |
Child selector | Use the> sign to get the parent-child level elements; note that the grandchildren level elements will not be obtained | $(“ul>li”); |
Descendant selector | Use spaces to represent descendant selectors to get all li elements under ul, including grandchildren, etc. | $(“ul li”); |
2: jQuery implicit iteration
The process of traversing internal DOM elements (stored in pseudo-array form) is called implicit iteration.
jQuery style cannot use style
jQuery style settings:
$('div').css('属性','值');
3: jQuery filter selector
Attributes | use | description |
---|---|---|
:first | $("li:first’) | Get the first li element |
:last | $("li:last’) | Get the last li element |
:eq(index) | $(“li:eq(2)”) | Among the obtained li elements, the element with index number 2 is selected, and the index number index starts from 0. |
:odd | $(“Ii:odd”) | Among the obtained li elements, select the element with an odd index number |
:even | $(“Ii:even”) | Among the obtained li elements, select the element with an even index number |
4: jQuery filtering method
Attributes | use | description |
---|---|---|
parent() | $(“li”).parent(); | Find parent |
children(selector) | $(“ul” ).children(“li”) | Equivalent to $("ul>li"), the nearest level (pro son) |
find(selector) | $(“ul” ).find(“li”); | Equivalent to $("ul li"), descendant selector |
siblings(selector) | $( “.first” ). siblings(“li”); | Find sibling nodes, not including yourself |
nextAll([expr]) | $(".first"). nextAl1() | Find all sibling elements after the current element |
prevtAll ([expr]) | $(".last") . prevAll() | Find all sibling elements before the current element |
hasClass(class) | $( 'div ’ ).hasClass(“protected”) | Check whether the current element contains a particular class, if so, return true |
eq(index) | $ (“Li”). Ea (2); | Equivalent to $("li:eq(2)"), index starts from 0 |
[Talking]
Suddenly discovered that the font can be changed Suddenly discovered that the font can be changedSudden natural hair now ,It may be to variations of the words thereof
suddenly found that the font may be changed
merrychristmas. Merry christmas.merrychristmas.
merry christmas
<body>
<div class="test"></div>
<div></div>
</body>
<script>
var flag = $('div:first').hasClass('test');
console.log(flag);
//结果返回true
</script>
5: jQuery's exclusive thought
<script>
//先全局函数
$(function () {
//点击li,让li添加底下内容
// 1:变化li的背景色
$(".tab_list li").click(function () {
$(this).addClass('current').siblings().removeClass('current');
// 2:变化底下的内容
// 获取被点击li的索引号
var index = $(this).index();
$(".tab_con .item").eq(index).show().siblings().hide();
})
})
</script>