What is the difference between eq() and get() methods in jQuery ?
Last Updated :
10 Aug, 2022
In this article, we will discuss all the differences between eq() and get() methods in jQuery.
eq() Method: This method is used to locate the selected elements directly and returns an element with a specific index.
Syntax:
$(selector).eq(index)
Example: In this example, we will set the different text colors on the 0th and 2nd index paragraphs.
HTML
<!DOCTYPE html>
<html>
<head>
<title>jQuery eq() Method</title>
<script src=
</script>
</head>
<body style="text-align: center;">
<h1 style="color: green;">
GeeksforGeeks
</h1>
<h3>jQuery eq() Method</h3>
<p class="text">HTML</p>
<p class="text">CSS</p>
<p class="text">JavaScript</p>
<script>
$(document).ready(function () {
$(".text").eq(0).css("color", "red");
$(".text").eq(2).css("color", "blue");
});
</script>
</body>
</html>
|
Output:
get() method: This method loads the data from the server by using the GET HTTP request. This method returns XMLHttpRequest object.
Syntax:
$.get( url, [data], [callback], [type] )
Example: In this example, we will get the data from the server and display it on the screen. This code will run on the server.
Filename: gfg.php
PHP
<?php
if( $_REQUEST["name"] ) {
$name = $_REQUEST['name'];
echo "A ". $name . " portal for geeks";
}
?>
|
Filename: index.php
HTML
<!DOCTYPE html>
<html>
<head>
<title>
CSS get() Method
</title>
<script src=
</script>
</head>
<body style="text-align: center;">
<h1 style="color: green;">
GeeksforGeeks
</h1>
<h3>CSS get() Method</h3>
<div id="GFG">
Welcome to GeeksforGeeks
</div>
<br>
<input type="button" id="Geeks" value="Load Data" />
<script>
$(document).ready(function () {
$("#Geeks").click(function (event) {
$.get(
"gfg.php", {
name: "Computer Science"
},
function (data) {
$('#GFG').html(data);
});
});
});
</script>
</body>
</html>
|
Output:
Difference between eq() and get() methods:
|
jQuery eq() Method
|
jQuery get() Method
|
| This method return the element as a jQuery object. |
This method returns a DOM element. |
| This method retrieves the n-1th jQuery object. |
This method returns the n-1th DOM element. |
| This method creates a new object from one element within the set and returns it. |
This method retrieves the DOM element that matches the jQuery object. |
| Its return method in an element with index of selected elements. |
It helps in loading data from the server using a HTTP GET request |
|
Its syntax is -:
$(selector).eq(index)
|
Its syntax is -:
$.get(URL,data,function(data,status,xhr),dataType)
|
| It takes one parameter as a index. |
It takes one parameter as a URL. |
Like Article
Suggest improvement
Share your thoughts in the comments
Please Login to comment...