jQuery获取元素的属性attr、值value、text和html


关键词

jQuery 属性

摘要

本文介绍在jQuery中如何获取元素的属性attr、值value、text和html。

获取元素的属性,使用attr方法,语法:
.attr('属性名');
多提一句:如果是要设置属性值,则使用attr('属性名','属性值');

获取元素的value值,多用于form控件,普通元素中没有。
.val()

获取元素的文本内容,即标签内部的文本内容,它会过滤掉标签中的子标签。语法:
.text()

获取元素的内部html信息,这个跟text()很像,但不过滤里面的html标签。语法:
.html()

下面举一个例子来说明:

<!DOCTYPE html>
<html lang="en" xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta charset="gbk" />
<script src="http://apps.bdimg.com/libs/jquery/2.1.1/jquery.min.js"></script>
</head>
<body>

<span id="s" data="abc"><i>xxx</i></span>

<p>
<a id="btn">show result</a>

<script>
$(function(){
    $("#btn").on('click', function(){
        alert('attr: ' + $('#s').attr('data')
            +'\r\n' + 'val(): ' + $('#s').val()
            +'\r\n' + 'text(): ' + $('#s').text()
            +'\r\n' + 'html(): ' + $('#s').html());
    });
});
</script>

</body>
</html>

最终的显示结果为:
attr: abc
val():
text(): xxx
html(): <i>xxx</i>

 

文章的版权

洪哥写文章很苦逼,如果本文对您略有帮助,点击感兴趣的广告支持洪哥!万分感谢!本文属于“洪哥笔记”原创文章,转载请注明来源地址:jQuery获取元素的属性attr、值value、text和html:http://www.splaybow.com/post/jquery-attr-val-text-html.html

关注与收藏

如果您在服务器运维、网络管理、网站或系统开发过程有需要提供收费服务,请加QQ:115085382!十年运维经验,帮您省钱、让您放心!
亲,如果有需要,先存起来,方便以后再看啊!加入收藏夹的话,按Ctrl+D


« jQuery二级分类联动 价格字体 »