jQuery获取指定表单html元素属性与值的几种方式

编辑:管理员 发布时间:2022-07-23 15:31:24348

在js的jquery插件中,想要获得指定元素的属性值,一般比较常用有attr()方法.

jquery的attr()方法,能够返回匹配多个元素中的第一个元素或设置指定匹配元素的一个或多个属性值.

示例1:

首先我们需要引入jquery插件

<script type="text/javascript" src="jquery.js"></script>

然后定义一个id为jqce的input元素

<input type="text" id="jqce" value="123" />

获取id为jqce元素的type属性值

<script type="text/javascript">

$("#jqce").attr('type');

</script>

设置id为jqce元素的属性值为button

<script type="text/javascript">

$("#jqce").attr('type','button');

</script>

定义该元素的多个属性,class类名为jqtxt,value属性值为abc

<script type="text/javascript">

$("#jqce").attr({'class':'jqtxt', 'value':'abc'})

</script>

通过函数来定义被选择元素的属性或值.

<script type="text/javascript">

$("#jqce").attr("value",function(n,u){

return u-1;

});

</script>

在jquery代码中除了使用attr()方法可以设置或返回被选择的元素属性值,还有prop()方法.

prop()方法与attr()方法比较类似,使用方法也与attr一样.

示例2:

<div id="a1" uid="123"></div>

<script type="text/javascript">

$("#a1").prop('uid',"ddd");

</script>

attr通过元素的特性来设置,而prop()通过属性来返回或设置匹配元素。

一般prop()方法主要用于检索属性值如tagName、nodeName、Checked或自定义属性等.

<input type="checkbox" checked id="jqce" value="1" />

<script type="text/javascript">

$("#jqce").attr('checkbox');

$("#jqce").prop('checkbox');

</script>

attr("checked")的返回值与复选框状态无关,当html标签代码中没有出现checked,无论复选框状态是否被选中,它始终返回undefined,当html标签中出现checked始终返回checked.

所以具有true和false两个属性的属性checked、selected或disabled.其它的html默认的属性建议attr方法.

<script type="text/javascript">

$("#a1").removeProp('uid');

</script>

如需移除属性,一般自定义的属性可以用removeProp()方法,而如id、style等默认的html属性需要用removeAttr()方法.

TAGS: js 表单
热门文章
最新文章

热门标签

数学计算路径命令行表单字符符号nginxcookiejavapython数组文字处理小数服务器管理apache图片处理