详解jQuery设置内容和属性

下面是详解jQuery设置内容和属性的完整攻略：

1.设置HTML元素内容

通过jQuery可以非常方便地设置HTML元素中的文本内容。可以使用.text()和.html()方法。

1.1 .text()方法

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

1.1.1 获取元素文本

使用 .text()方法获取元素的文本内容：

var content = $("selector").text();

其中，selector是需要获取文本内容的元素选择器。

1.1.2 设置元素文本

使用 .text()方法设置元素的文本内容：

$("selector").text("new text content");

其中，new text content是需要设置的元素新的文本内容。

1.2 .html()方法

.html()方法可以用于设置或获取元素的HTML内容。

1.2.1 获取元素HTML内容

使用 .html()方法获取元素的HTML内容：

var content = $("selector").html();

其中，selector是需要获取HTML内容的元素选择器。

1.2.2 设置元素HTML内容

使用 .html()方法设置元素的HTML内容：

$("selector").html("<h1>new HTML content</h1>");

其中，<h1>new HTML content</h1>是需要设置的元素新的HTML内容。

2.设置HTML元素属性

通过jQuery可以非常方便地设置HTML元素的属性。可以使用.attr()方法。

2.1 .attr()方法

.attr()方法可以用于设置或获取元素的属性。

2.1.1 获取元素属性

使用 .attr()方法获取元素的属性：

var value = $("selector").attr("attribute");

其中，attribute是需要获取属性的名称，selector是需要获取属性的元素选择器。

2.1.2 设置元素属性

使用 .attr()方法设置元素的属性：

$("selector").attr("attribute", "new attribute value");

其中，attribute是需要设置的属性名称，new attribute value是需要设置的属性值。

3.示例说明

3.1 设置文本内容示例

以下代码将HTML元素中的文本内容修改为Hello World：

$(document).ready(function(){
    $("#myButton").click(function(){
        $("#myParagraph").text("Hello World");
    });
});

当点击myButton按钮时，会将myParagraph元素的文本内容修改为Hello World。

3.2 设置属性示例

以下代码将HTML元素中的src属性修改为newimage.jpg：

$(document).ready(function(){
    $("#myButton").click(function(){
        $("#myImage").attr("src", "newimage.jpg");
    });
});

当点击myButton按钮时，会将myImage元素的src属性修改为newimage.jpg。