jquery中如何获取修改设置元素中的内容及元素中的属性值

最新推荐文章于 2023-02-03 22:30:00 发布

原创最新推荐文章于 2023-02-03 22:30:00 发布 · 841 阅读

1 ·

CC 4.0 BY-SA版权

jquery 专栏收录该内容

15 篇文章

订阅专栏

本文介绍使用jQuery库操作网页元素的方法，包括设置或获取文本、HTML内容、表单字段值，以及元素属性如href。文章详细解释了text()、html()、val()和attr()等方法，并展示了如何通过回调函数实现更复杂的操作。

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

1. 获得内容 - text()、html() 以及 val()

text() - 设置或返回所选元素的文本内容
html() - 设置或返回所选元素的内容（包括 HTML 标记）
val() - 设置或返回表单字段的值

2. 获取属性 - attr()
例如：
$("button").click(function(){
  alert($("#w3s").attr("href"));  /* 获取id为w3s元素中属性href对应的网址 */
});

3. 上面的三个 jQuery 方法：text()、html() 以及 val()，同样拥有回调函数。回调函数由两个参数：被选元素列表中当前元素的下标，以及原始（旧的）值。然后以函数新值返回您希望使用的字符串。
例如：
$("button").click(function () {
    $(".ul02 li").html(function (index, old_content) {
        return old_content + index;
    })
})

4. 设置属性 - attr,可以一次设置多个属性值
例如：
$("button").click(function () {
    $("a").attr({href: "http://www.mayanan.cn", target: "_blank"});
})

5. jQuery 方法 attr()，也提供回调函数。回调函数由两个参数：被选元素列表中当前元素的下标，以及原始（旧的）值。然后以函数新值返回您希望使用的字符串。
例如：
$("button").click(function () {
    $("a").attr("href", function (index, old_content) {
        return old_content + "/jquery/";
    })
})