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

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

在这篇文章中,我们将看到如何使用jQuery来选择元素的id。要学习这个话题,你应该有关于HTMLCSS、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>

输出:

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

Python教程

Java教程

Web教程

数据库教程

图形图像教程

大数据教程

开发工具教程

计算机教程