jQuery - 获取内容和属性

在前端开发中，我们经常需要获取页面元素的内容和属性，以便进行相应的操作。jQuery提供了一系列方法来获取元素的内容和属性，本文就来介绍一下。

获取元素内容

.text()方法用来获取元素的文本内容，返回一个字符串。

<p>This is a paragraph.</p>

$('p').text(); // "This is a paragraph."

.html()方法用来获取元素的HTML内容，返回一个字符串。

<div><p>This is a paragraph.</p></div>

$('div').html(); // "<p>This is a paragraph.</p>"

.val()方法用来获取表单元素的值，返回一个字符串。

<input type="text" value="hello world">

$('input').val(); // "hello world"

.attr()方法用来获取元素的属性值，返回一个字符串。

<img src="example.png" alt="example">

$('img').attr('src'); // "example.png"

.prop()方法用来获取元素的属性值，返回一个布尔值、数字或者字符串。

<input type="checkbox" checked>

$('input').prop('checked'); // true

.data()方法用来获取元素的数据属性值，返回一个字符串。

<div data-id="1" data-name="example"></div>

$('div').data('id'); // "1"

.css()方法用来获取元素计算后的样式，返回一个字符串。

<p style="color: red;">This is a paragraph.</p>

$('p').css('color'); // "rgb(255, 0, 0)"

以上是jQuery获取元素内容和属性的方法，不同的方法根据实际需求选择使用即可。需要注意的是，对于多个元素的操作，需要通过遍历来获取每一个元素的内容和属性。