.html(),.text()和.val()的差异总结

~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~
开发工具与关键技术:DW
作者:张海锋
撰写时间:2019-04-10
~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~

  1. .html()  .text()  .val()三种方法都是用来读取选定元素的内容,

只不过.html()是用来读取元素的html内容,

.text()用来读取元素的纯文本内容,包括其后代元素,

.val()是用来读取表单元素的"value"值。

其中.html()和.text()方法不能使用在表单元素上,而.val()只能使用在表单元素上;

另外.html()方法使用在多个元素上时,只读取第一个元素;.val()方法和.html()相同, 如果其应用在多个元素上时,只能读取第一个表单元素的"value"值,但是.text()和他们   不一样,如果.text()应用在多个元素上时,将会读取所有选中元素的文本内容。

  1. .html( htmlString )  设置每一个匹配元素的html内容,

.text( textString ) 用于设置匹配元素内容的文本和

.val( value ),设置匹配的元素集合中每个元素的值,

三种方法都是用来替换选中元素的内容,如果三个方法

同时运用在多个元素上时,那么将会替换所有选中元素的内容。

      3、.html(),.text(),.val()都可以使用回调函数的返回值来动态的改变多个元素的内容。

下面就演示一下.val()获取元素和改变元素的案例:

getVal:这个方法是获取元素的

setVal:这个方法是设置元是值

        var value = document.getElementById("txtAddress").value;

        function getVal(){

            var txtName = $("#txtName").val();获取姓名

            var cboSex = $("#cboSex").val();获取性别

            var txtAddress = $("#txtAddress").val();获取地址

            alert("姓名:" + txtName + 性别:" + cboSex + 地址:" + txtAddress);

        }

        function setVal(){

            $("#txtName").val("张三");

            $("#cboSex").val("男");

            $("#txtAddress").val("广州");

        }

图片效果:(首先输入值)

 

下面是获取值得效果: 

最后是点击设置值得效果:

  • 2
    点赞
  • 13
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值