jQuery如何获取指定的属性值

在jQuery输入元素表达式属性名即可得到。

如：

1$("#textId")attr("width")是获取Id为textId的控件的width属性。

2$("className")attr("width")是获取包含class名为className的控件的width属性。

3$("[name=textName]")attr("width")是获取name为textName的控件的width属性。

但要注意，jquery取到的可能是一个数组，如果确定属性为同一值，则没问题，否则应该循环取得控件，再取属性值。如：$("#textId")[0]width是取第一个控件的width属性。但也有写属性用attr取不到，也需要用角标的方式取得控件后再取属性。

jQuery是一个快速、简洁的JavaScript框架，是继Prototype之后又一个优秀的JavaScript代码库（或JavaScript框架）。jQuery设计的宗旨是“write Less，Do More”，即倡导写更少的代码，做更多的事情。它封装JavaScript常用的功能代码，提供一种简便的JavaScript设计模式，优化HTML文档 *** 作、事件处理、动画设计和Ajax交互。

jQuery的核心特性可以总结为：具有独特的链式语法和短小清晰的多功能接口；具有高效灵活的css选择器，并且可对CSS选择器进行扩展；拥有便捷的插件扩展机制和丰富的插件。jQuery兼容各种主流浏览器，如IE 60+、FF 15+、Safari 20+、Opera 90+等。

需要知道这个标签是什么，然后使用名字来定位。

例如：

<input name='username' value='enozoomcom' />

来获取这个name为username的value值

$(function(){

alert($("input[name='username']")val())

})

扩展资料：

jquery中的常见小技巧：

1、DOM遍历是昂贵的，将变量缓存起来。

代码：

var $ele = $('#ele');

var h =

$eleheight();

$elecss('height',h-20);

2、优化选择符。

代码：

$('#myid')

3、避免隐式通用选择符。

代码：

$('someclass input:radio')

4、避免通用选择符。

代码：

$('container')children()

5、尽可能保持代码简洁。

代码：

if(arrlength){}

6、尽可能地合并函数。

代码：

$fon("click", function(){

$(this)css({

'border':'1px solid

red',

'color': 'blue'

});

});

name是input标签的属性值，jQuery提供了attr() 方法用于设置/改变属性值

1

2

$("input:text")attr("name");

$("input:text")prop("name"); // 也可以使用prop()方法获取属性

示例代码如下

创建Html元素

1

2

3

4

5

6

7

<div class="box">

<span>点击按钮获取文本框的name属性值：</span>

<div class="content">

<input type="text" name="test" value="这个文本框的name属性值为test">

</div>

<input type="button" class="btn" value="获取文本框name值">

</div>

设置css样式

1

2

3

4

5

divbox{width:300px;height:250px;padding:10px 20px;margin:20px;border:4px dashed #ccc;}

divbox>span{color:#999;font-style:italic;}

divcontent{width:250px;height:100px;margin:10px 0;padding:5px 20px;border:2px solid #ff6666;}

input[type='text']{width:200px;height:30px;border:none;}

input[type='button']{width:120px;height:30px;margin:10px;border:2px solid #ebbcbe;}

编写jquery代码

1

2

3

4

5

$(function(){

$("input:button")click(function() {

alert($("input:text")attr("name"));

});

})

最好第一个

button

都定义一个

id

的性情，这样就能一个一个获取了，如果你用

class，那不知道是哪一个了，如果是

<input

type="button"

name="button1"

class="button"

id="button1"

value="提交">

那么用$("#button1")attr("name")就能获得他的name值了

根据多选框name来获得选中的值可用如下 jquery代码实现

$("input:checkbox[name='test']:checked")each(function() { // 遍历name=test的多选框

  $(this)val();  // 每一个被选中项的值

});

实例演示：给出两组多选框，点击按钮后分别获得两组中被选择的项目

示例代码如下

创建Html元素

<div class="box">

<span>请输入用户名，限定字母、数字或下划线的组合：</span><br>

<div class="content">

<span>水果：</span><br>

<input type="checkbox" name="fruit" value="梨子"/>梨子

<input type="checkbox" name="fruit" value="李子"/>李子

<input type="checkbox" name="fruit" value="栗子"/>栗子

<input type="checkbox" name="fruit" value="荔枝"/>荔枝<br>

<span>蔬菜：</span><br>

<input type="checkbox" name="vegetable" value="青菜"/>青菜

<input type="checkbox" name="vegetable" value="萝卜"/>萝卜

<input type="checkbox" name="vegetable" value="土豆"/>土豆

<input type="checkbox" name="vegetable" value="茄子"/>茄子

</div>

<input type="button" value="提交">

</div>

设置css样式

divbox{width:300px;padding:20px;margin:20px;border:4px dashed #ccc;}

divbox span{color:#999;font-style:italic;}

divcontent{width:250px;margin:10px 0;padding:20px;border:2px solid #ff6666;}

input[type='checkbox']{margin:5px;}

input[type='button']{height:30px;margin:10px;padding:5px 10px;}

编写jquery代码

$(function(){

// 设置属性值

$("input:button")click(function() {

var fruit = "";

var vegetable = "";

$("input:checkbox[name='fruit']:checked")each(function() {

fruit += $(this)val() + " ";

});

$("input:checkbox[name='vegetable']:checked")each(function() {

vegetable += $(this)val() + " ";

});

alert("已选择水果："+fruit+"，已选择蔬菜："+vegetable);

});

})

观察效果

   $('div[name=poo]')each(function(){

      consolelog($('div[name=sunPrice]',$(this))text());

      consolelog($('div[name=dec]',$(this))text());

   });

补充说一下，name属性通常用于表单控件（input、button等），以便实现前后端通讯，而用于其他标签则意义不大，且不利于js定位。建议改用class：

<div id="tab">

<div class="poo">

<div class="sunPrice">1233</div>

<div class="dec">案情描述</div>

</div>

<div class="poo">

<div class="sunPrice">1900</div>

<div class="dec">什么</div>

</div>

</div>   $('poo')each(function(){

      consolelog($('sunPrice',$(this))text());

      consolelog($('dec',$(this))text());

   });

1、编写基础的HTML文档。

2、使用val()获取值。

3、保存文件，查看属性选择器获取的值。

4、然后在script里添加一个function，按钮事件的函数。使用jquery的 attr方法来设置属性就行了，参数第一个是要添加的属性名，第二个就是属性的值。这里我们为div添加一个id属性。

5、保存文件，查看attr()就可以获取的属性值。

以上就是关于jQuery如何获取指定的属性值全部的内容，包括:jQuery如何获取指定的属性值、jquery中怎么根据name属性定位一个元素、用jquery怎样获得input 的name为name的值等相关内容解答，如果想了解更多相关内容，可以关注我们，你们的支持是我们更新的动力！