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

news/2024/7/10 23:52:15 标签: val()与value的区别, jquery, javascript

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

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>

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

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


http://www.niftyadmin.cn/n/864471.html

相关文章

学习总结之Html篇章

text-indent &#xff1a;文本缩进 display:inline-block 行内元素 display&#xff1a;block 块级元素 display&#xff1a;none 不显示而且也不占html的位置 hidden&#xff1a;hidden 占用html位置 background-size&#xff1a;cover图片自适应 justufy 文本两端对齐 borde…

jquery文档就绪的三种书写方式

//写法一 $(document).read(function(){alert("文档加载完毕!"); })//写法二 $().read(function(){alert("文档加载完毕!"); })//写法三 $(function(){alert("文档加载完毕!"); })永远相信&#xff0c;美好明天就在不久将来

line-height失效解决办法

对和文字相连接的img、input、textarea、select、object等元素加以属性 margin: (所属line-height-自身img,input,select,object高度)/2px 0; vertical-align:middle-------垂直居中同时该属性指挥对inline-block元素起作用哟

什么是DOM(个人理解)

了解DOM需要清楚几个问题&#xff1a; 什么是DOM&#xff1f;DOM可以用来干什么&#xff1f;DOM是怎么来的&#xff1f;怎么使用DOM&#xff1f;什么是DOM? DOM(document Object Model&#xff09;,是针对HTML和XML的API。 可以理解为DOM就是一系列功能集合。 DOM可以用来干…

css3中的图片滤镜使用以及对雪碧图的基本操作

图片滤镜我就不过多解释了&#xff0c;就是通过大神们写的算法对图片进行处理&#xff0c;常见的如美图秀秀等&#xff0c;下面我们来一起复习下&#xff0c;在html中滤镜的操作 1、滤镜的基本函数&#xff0c;有些浏览器目前还处于兼容状态&#xff0c;所以在前面一定要加上内…

html前端命名规则

前端布局规范细则 一、命名规范&#xff1a; 1、基本要求&#xff1a; 1&#xff09;文件编码统一使用 UTF-8 编码&#xff1b; 2&#xff09;命名时以符合语义为主要参考指标&#xff0c;CSS属性书写规范&#xff0c;采用统一风格及命名方法&#xff1b; 3&#xff09;结…

JavaScript添加标签样式兼容浏览器

今天突然使用原生态的JavaScript给标签添加样式的时候遇到尴尬了&#xff0c;然后冥冥之中看到了这样的方式&#xff0c;保存一下&#xff0c;以作为以后的笔记 cssText 的使用     obj.cssText " width:200px;position:absolute;left:100px;"; 正如那篇文章…

JavaScript中比较操作符

var s"";var ss0;//typeof s为string 字符串为空 则表示Boolean类型的false number中0代表false 1代表true//typeof false为Boolean// 值要相同,同时类型也要相同,属于严格上的比较if(ssfalse)alert("不严格比较\n字符串和boolean类型比较返回是");if(s…