首页 » 技术分享 » Jquery中.val()与.value之间的区别

Jquery中.val()与.value之间的区别

　
评论关闭　1,391次浏览

三年多没敲过代码了，今年打算捡起来，是需要多么大的勇气。但是为了实现自我价值，履行自我的承诺，这就是责任。没有什么难不难，晚不晚之说，是我经常对别人说的那样，再晚不过心晚，，一切努力了，实现了每一天的价值，结果也就不重要了，说起来我的经历有点像刘强东，什么事儿都干过……哈哈不说了，简短吐下槽，开始今天的总结。

1、Juqery中.val()与.value之间的区别
先说理论：
.val()方法，一个是带参：给输入框赋值，一个是不参数的方法：获取输入框的值
.value：获取Dom标签元素的value值，属于原生态JavaScript的写法 

知道大概理论之后我们上code，解析一次

2、用代码区别两者的差异

A、.val()之code

<!DOCTYPE HTML>
<html>

	<head>
		<meta charset=UTF-8 />
		<title>Nothing</title>
		<style type="text/css">

		</style>
		<script type="text/javascript" src="js/jquery-3.3.1.min.js" ></script>
		<script type="text/javascript">
		$(document).ready(function(){
			$("#txt_1").val("");
			$("#btn_submit").on("click",function(){
				//我们开始给文本框赋值
					$("#txt_1").val("大吉大利，今晚吃鸡");
					alert($("#txt_1").val());//获取文本框的值
			})
		})
		</script>
	</head>

	<body>
		笔名：<input type="text" id="txt_1" />
		<input type="button" id="btn_submit" value="赋值给笔名文本框">
	</body>

</html>

B、.value之code

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Document</title>
    <script type="text/javascript" src="js/jquery-3.3.1.min.js" ></script>
</head>
<body>
    <div id="box">
        <input type="text">
        <input type="text">
        <input type="text">
        <input type="text">
        <input type="button" id="btn" onclick="Total()" value="转化为数组">
    </div>
    <!--<script src="这里是jquery文件路径"></script>-->
    <script>
    function Total() {
        var numArr = []; // 定义一个空数组
        var txt = $('#box').find(':text'); // 获取所有文本框
        var s=txt.eq(0).val(); //jquery的写法
        var ss=txt[0].value;//JavaScript的写法 //如果是获取btn的值就要用value了 
        alert(s);
        
    }
    </script>
</body>
</html>

今天就遇到这个问题，纠结了半天，通过这个例子自己也就明白了。

小白书写中，还望各位大牛引路，有什么不正确之处希望指定

转载自原文链接, 如需删除请联系管理员。

原文链接：Jquery中.val()与.value之间的区别，转载请注明来源！

赞 0