jquery元素內容: html(),text(),val()
<!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <title>元素的内容: html(),text(),val()</title> </head> <body> <div></div> <form> 邮箱: <input type="text" name="email"> <button>提交</button> </form> </body> </html>
html()與attr(),css()一樣,根據參數不同,自帶讀取與設定功能
1.設定元素內容,可以包含任何內容:子元素或文字,與原生的innerHTML屬性一樣
建立文字節點
var res = $('div').html('jQuery真的好方便')
建立元素節點
var res = $('div').html('<h2>jQuery真的好方便</h2>')
取得元素內容
var res = $('div').html()
2.取得元素中的文字內容:類似原生中的textContent屬性
取得單標籤中的文字,會自動將子元素標籤< h2>過濾掉,只留下文字部分
var res = $('div').text()
如果元素內容有多個子元素,這些子元素的文字會合併
var res = $('div').html('<h2>jQuery真的好方便</h2><p>大家要好好学</p>')
我們先用html()輸出看一下
var res = 'html()输出:'+$('div').html()
再用text()方法輸出,將二種輸出結果進行比較,注意控制台中的換行使用\n
res += '\n' + 'text()输出:' + $('div').text()
text()如果有參數,就是設定操作
var res = $('div').text('祝愿大家早日成为一名合格的Web开发程序员')
3.取得或設定表單控制項中的資料:val(),等價於原生中的表單元素的value屬性
$('button').click(function(){讀取value屬性的值
alert($(':text').val())
設定value屬性的值
$(':text').val('zhu@php.cn')
alert($(':text').val())
})控制台查看結果
console.log(res)
以上是jquery元素內容: html(),text(),val()的詳細內容。更多資訊請關注PHP中文網其他相關文章！
