Example of get of method usage in jQuery

  • 2020-05-09 18:11:57
  • OfStack

This article illustrates the use of the get() method in jQuery as an example. Share with you for your reference. The specific analysis is as follows:

This method returns an array of all DOM elements in the matching collection or an DOM element with a specified index.
The index value starts at 0.

Note: as you can see from the above definition, this method converts jQuery objects into DOM objects.

Grammatical structure 1:

$(selector).get()

When there are no arguments, we get an array of all matched DOM elements.

Example code:


<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<meta name="author" content="//www.ofstack.com/" />
<title>get() function - The home of the script </title>
<script type="text/javascript" src="mytest/jQuery/jquery-1.8.3.js"></script>
<script type="text/javascript">
$(document).ready(function(){
  $($(".zhuanqu").get()).css("color","green");
})
</script>
</head>
<body>
<div>
  <ul>
    <li>ASP The zone </li>
    <li class="zhuanqu">jsp The zone </li>
    <li>php The zone </li>
    <li>ASP.NET The zone </li>
  </ul>
  <ul>
    <li>DIV+CSS The zone </li>
    <li class="zhuanqu">Jquery The zone </li>
    <li class="zhuanqu">javascript The zone </li>
    <li>html The zone </li>
  </ul>
</div>
</body>
</html>

You can get an array of li elements with class name zhuanqu by using $(".zhuanqu ").get (). If you look at the example, you might ask why you want to put $() on it. This is because the get() method gives you an DOM object, which you need to convert to an jQuery object in order to use the CSS() method.

Grammatical structure 2:

$(selector).get(index)

Takes a parameter to get the 1 matched element specified in the array of all matched DOM elements.

Example code:


<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<meta name="author" content="//www.ofstack.com/" />
<title>get() function - The home of the script </title>
<script type="text/javascript" src="mytest/jQuery/jquery-1.8.3.js"></script>
<script type="text/javascript">
$(document).ready(function(){
  $($(".zhuanqu").get(0)).css("color","green");
})
</script>
</head>
<body>
<div>
  <ul>
    <li>ASP The zone </li>
    <li class="zhuanqu">jsp The zone </li>
    <li>php The zone </li>
    <li>ASP.NET The zone </li>
  </ul>
  <ul>
    <li>DIV+CSS The zone </li>
    <li class="zhuanqu">Jquery The zone </li>
    <li class="zhuanqu">javascript The zone </li>
    <li>html The zone </li>
  </ul>
</div>
</body>
</html>

The parameter inside is the index of the DOM object in the array of DOM objects to be retrieved. The index starts from zero.

I hope this article has been helpful to your jQuery programming.


Related articles: