Home > Web Front-end > JS Tutorial > Use cases of jQuery :lt(index) selector

Use cases of jQuery :lt(index) selector

黄舟
Release: 2017-06-23 10:40:25
Original
1501 people have browsed it

The example in this article describes the usage of the :lt selector in jQuery. Share it with everyone for your reference. The specific analysis is as follows:

This selector matches all elements that are less than the given index value.
The minimum index value starts from 0.

Grammar structure:

$(":lt(index)")
Copy after login

This selector is generally used in conjunction with other selectors, such as Class selector and Element selector, etc. wait.
For example:

$("li:lt(3)").css("color","blue")
Copy after login

The above code can set the font color in the li element with an index less than 3 to blue.
If not used with other selectors, the default state is to be used with the * selector, for example, $(":lt") is equivalent to $("*:lt").

Parameter list:

Parameter Description

index The given index value.

Example code:

Example 1:










  • html专区
  • div+css专区
  • jQuery专区
  • Javascript专区
Copy after login

The above code can set the font color of the li elements in the li element collection with an index value less than 3 to blue.

Example 2:

<!DOCTYPE html>
<html>
<head>
<meta charset=" utf-8">
<meta name="author" content="http://www.jb51.net/" />
<title></title>
<script type="text/javascript" src="mytest/jQuery/jquery-1.8.3.js"></script>
<script type="text/javascript"> 
$(document).ready(function(){ 
  $("#btn").click(function(){ 
    $("*").each(function(){ 
      alert(this.tagName); 
    })         
  }) 
  $("#show").click(function(){ 
    $(":lt(11)").css("border","1px solid red"); 
  }) 
}); 
</script>
</head>
<body>
<ul>
  <li>html专区</li>
  <li>div+css专区</li>
  <li>jQuery专区</li>
  <li>Javascript专区</li>
</ul>
<button id="btn">遍历所有元素</button>
<button id="show">点击查看选择器效果</button>
</body>
</html>
Copy after login

Since the above code does not specify a selector to be used with the :lt selector, it is used with the * selector by default, so the above code can change the current The border color of all elements in the document with an index value less than 11 is set to red.

The above is the detailed content of Use cases of jQuery :lt(index) selector. For more information, please follow other related articles on the PHP Chinese website!

Related labels:
source:php.cn
Statement of this Website
The content of this article is voluntarily contributed by netizens, and the copyright belongs to the original author. This site does not assume corresponding legal responsibility. If you find any content suspected of plagiarism or infringement, please contact admin@php.cn
Popular Tutorials
More>
Latest Downloads
More>
Web Effects
Website Source Code
Website Materials
Front End Template