jquery .attr("value") 与 .val() 区别以及siblings()用法

最新推荐文章于 2023-03-08 22:20:29 发布

勤而思

最新推荐文章于 2023-03-08 22:20:29 发布

阅读量8.2k

点赞数 2

分类专栏： web

本文链接：https://blog.csdn.net/wen1652166675/article/details/54582422

版权

web 专栏收录该内容

9 篇文章 0 订阅

订阅专栏

.val() 能够取到针对text，hidden可输入的文本框的value值。

而 .attr('value') 可以取到html元素中所设置的属性 value的值，不能获取动态的如input type="text" 的文本框手动输入的值。

siblings()用法：通过元素的class属性选择多个兄弟元素中的具体哪一个；

var itassetsID = $(this).attr("id");
var itassets_content = $(this).siblings(".input1").val();

　jQuery中有3个获取元素value值的函数比较相似：attr(), prop(), val()；拿来比较一下。
　　　
　　　示例代码：

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title></title>
    <script src="jquery-2.1.4.js"></script>

</head>
<body>
<input type="text" value="123"/>
<button id="btn">click</button>
<script>

    $("#btn").click(function(){
        var attr=$("input").attr("value");
        var prop=$("input").prop("value");
        var val=$("input").val();
        console.log(attr);
        console.log(prop);
        console.log(val);
    })
</script>
</body>
 
 1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
 
 
  
  
 
 
 
 1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23

　　　代码如上所示，为输入框设定了初始值：123，此时点击按钮，控制台输出为：
　　　

　　　改变输入框的值，此时控制台输出：
　　　

123
123thgf
123thgf
 
 1
2
3
 
 1
2
3

　　　如果我们没有为文本框设定初始值，即删除value=”123”后，依旧使用如上js代码，则相应输出如下：
　　　

undefined



 
 1
2
3
4
 
 1
2
3
4

　　attr()输出为undefined，而prop()和val()输出为“空”。
　　输入value值后：控制台输出为：
　　

undefined
asdasd
asdasd
 
 1
2
3
 
 1
2
3

　　　attr()输出依然为undefined，而prop()和val()则输出实际值。

勤而思

关注

2
点赞
踩
6

收藏

觉得还不错? 一键收藏
1
评论
jquery .attr("value") 与 .val() 区别以及siblings()用法

.val() 能够取到针对text，hidden可输入的文本框的value值。而 .attr('value') 可以取到html元素中所设置的属性 value的值，不能获取动态的如input type="text" 的文本框手动输入的值。siblings()用法：通过元素的class属性选择多个兄弟元素中的具体哪一个；var itassetsID = $(this).
复制链接

扫一扫