如何在jQuery中通过ID选择元素

在这篇文章中，我们将看到如何使用jQuery来选择元素的id。要学习这个话题，你应该有关于HTML、CSS、JavaScript和jQuery的知识。

使用JavaScript：这个问题也可以通过一个流行的JavaScript方法来解决，这个方法叫做d ocument.getElementById() ，用于通过id属性来选择元素。getElementById()方法返回具有给定ID的元素，该ID被传递给该函数。这个函数在网页设计中被广泛使用，以改变任何特定元素的值或获得一个特定元素。如果传递给函数的ID没有退出，那么它将返回null。

语法:

document.getElementById('idname')

示例:

<!DOCTYPE html>
<html>
  
<head>
    <title>
        How do you select element by ID in javascript?
    </title>
</head>
  
<body style="border: 2px solid green; 
    min-height: 240px; text-align: center;">
      
    <h1 style="color:green;">
        GeeksforGeeks
    </h1>
      
    <p id="element" style="margin-top:20px;"></p>
  
    <script>
        setTimeout(function() {
            document.getElementById('element').innerText 
                = 'Hello Geeks !! Welcome to GeeksforGeeks';
        }, 2000);
    </script>
</body>
  
</html>

输出:

如何在jQuery中通过ID选择元素？

使用jQuery：上述代码也是通过使用jQuery方法完成的，它非常简单，用较少的代码完成。#id选择器为要选择的元素指定一个id。它不应该以数字开头，而且id属性在一个文档中必须是唯一的，这意味着它只能被使用一次。

syntax:

$("#idname");

示例:

<!DOCTYPE html>
<html>
  
<head>
    <title>
        How do you select element 
        by ID in javascript?
    </title>
      
    <script src=
"https://cdnjs.cloudflare.com/ajax/libs/jquery/3.6.0/jquery.min.js">
    </script>
</head>
  
<body style="border: 2px solid green; 
    min-height: 240px; text-align: center;">
      
    <h1 style="color:green;">
        GeeksforGeeks
    </h1>
      
    <p id="element" style="margin-top:20px;"></p>
  
    <script>
        setTimeout(function () {
            $('#element').text(
                'Hello Geeks !! Welcome to GeeksforGeeks');
        }, 2000);
    </script>
</body>
  
</html>