jQuery 获取和设置HTML元素

jQuery 中包含更改和操作 HTML 元素和属性的强大方法。我们可以通过这些方法来获取 HTML 元素中的文本内容、元素内容（例如HTML标签）、属性值等。

text()方法

text() 方法可以用于设置或获取所选元素的文本内容。

示例：

例如我们获取下列

标签中的文本内容：

  
你好，欢迎来到侠课岛!
  

    
希望侠课岛中有适合你的编程课程。
  

在浏览器中演示效果：

image

除了获取文本内容，text() 还可以用于设置文本内容，我们可以来看一下。

示例：

例如通过 text() 将 .content 的文本内容设置为 hello, xkd!：

  
你好，欢迎来到侠课岛!
  
点击按钮

在浏览器中演示效果：

html()方法

html() 方法用于设置或返回所选元素的内容（包括HTML标记）。

示例：

通过 html() 方法获取 p 元素的内容：

  
你好，欢迎来到侠课岛!

在浏览器中演示效果：

除此之外，我们还可以使用 html() 方法来设置指定元素的内容：

  
向下面的p标签中添加文本内容：
  

在浏览器中演示效果：

val()方法

val() 用于设置或返回表单字段的值。该方法大多时候用于 input 元素。

示例：

例如获取输入框 input 中的值：

  文本输入框：
  

    获取输入框的值
  

在浏览器中演示效果：

如果要使用 val() 方法设置 value 的值，我们可以像下面这样做：

  文本输入框：
  

    获取输入框的值
  

在浏览器中演示效果：

attr()方法

attr() 方法用于设置或返回被选元素的属性值。

示例：

例如下面这个例子：

  
获取class属性的值

在浏览器中演示效果：

image

attr() 方法除了获取元素的属性值，还可以设置元素的属性值，我们来看一下。

示例：

将下面

标签中的 class 属性的值设置为 summer：

  
设置class属性的值

在浏览器中演示效果：

image

链接：https://www.9xkd.com/