html、text、val、attr、prop區別。this.value和$(this).val()區別以及return用法

html()：

html() 方法返回或設置被選元素的內容 (inner HTML)。

當使用該方法讀取多個值時，它會返回第一個匹配元素的內容。

當使用該方法設置一個值時，它會覆蓋所有匹配元素的內容。

取元素內容的時候會把指定元素下面的代碼標簽也能獲取到

 

text()

讀取多個返回多個

和html()類似，但是只獲取指定元素純文本內容

 

val()：

返回或設置被選元素的值（讀取多個只返回第一個），這點和html()類似

通過value屬性設置和獲取，常用於input元素，只能用在表單元素上

 

attr()：

$().attr(屬性名，屬性值)→$(selector).attr(attribute,value)

也可設置多個$(selector).attr({attribute:value, attribute:value ...})

返回或設置被選元素屬性值，value的屬性值

一共有四種寫法：

attr(屬性名)，獲取第一個屬性值，如果沒有返回undefined

attr(屬性名，屬性值)，設置所以匹配元素的屬性值

attr(屬性名，函數值)，設置屬性的函數值

attr({屬性名一: “屬性值一” , 屬性名二: “屬性值二” , … … })，批量設置屬性值

 

prop()

當該方法用於返回屬性值時，則返回第一個匹配元素的值。

當該方法用於設置屬性值時，則為匹配元素集合設置一個或多個屬性/值對。

四種用法和attr一樣。

 

attr(),prop()的使用和區別：

Attribute/Property	.attr()	.prop()
accesskey	√
align	√
async	√	√
autofocus	√	√
checked	√	√
class	√
contenteditable	√
draggable	√
href	√
id	√
label	√
location ( i.e. window.location )	√	√
multiple	√	√
readOnly	√	√
rel	√
selected	√	√
src	√
tabindex	√
title	√
type	√
width ( if needed over .width() )	√

　　

 

　　

　　獲取狀態表達不同：

　　attr('checked'): checked（沒選中時，attr獲取的是undefined）
　　prop('checked'): true（統一返回true和false）

　　添加屬性名稱立即生效的用prop;

　　有true和false兩個屬性的可以用prop;

　　固有屬性的可以考慮使用prop;

　　其他情況可考慮用attr，比如自定義的dom屬性action處理時使用attr

　　

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

value：是html標簽value屬性

this.value是JS原生態寫法，$(this).val()是JQ的寫法

return， 把控制權返回給頁面。

return false， 終止處理

return true，繼續執行