.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("广州");

        }

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

 

下面是获取值得效果： 

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