Difference between val() and text()

问题

What the difference between jQuery's functions val() and text()?

Where would you use one over the other?

解答

.val() works on input elements (or any element with a value attribute?) and .text() will not work on input elements.

.val() gets the value of the input element -- regardless of type. .text() gets the innerText (not HTML) of all the matched elements:

.text()

The result is a string that contains the combined text contents of all matched elements. This method works on both HTML and XML documents. Cannot be used on input elements. For input field text use the val attribute.

.val()

Get the content of the value attribute of the first matched element

实战

<input type="hidden" name="ctl00$cphMain$ucProfile$Avatar$hffulList" id="ctl00_cphMain_ucProfile_Avatar_hffulList" value="[{&quot;FileName&quot;:&quot;Hearthstone.jpg&quot;,&quot;Size&quot;:539890,&quot;ContentType&quot;:&quot;image/jpeg&quot;,&quot;PhysicalName&quot;:&quot;aae0a752-a07c-4d3f-9be0-c7caf5346e69.jpg&quot;,&quot;FileuploadStoreType&quot;:0,&quot;FileuploadId&quot;:0,&quot;FilePath&quot;:null,&quot;TempPath&quot;:null}]">

$('#ctl00_cphMain_ucProfile_Avatar_hffulList').val()
"[{"FileName":"Hearthstone.jpg","Size":539890,"ContentType":"image/jpeg","PhysicalName":"aae0a752-a07c-4d3f-9be0-c7caf5346e69.jpg","FileuploadStoreType":0,"FileuploadId":0,"FilePath":null,"TempPath":null}]"

$('#ctl00_cphMain_ucProfile_Avatar_hffulList').text()
""