jQuery中，html和text以及val区别

假设有如下代码：

<div class="parent">
    <div>
        111
        <div>
            222
            <div>
                333
            </div>
        </div>
    </div>
</div>

使用不同的函数返回不同：

• $(".parent").text(),返回：

"
    
        111
        
            222
            
                333
            
        
    
"

• $(".parent").html(),返回：

"
    <div>
        111
        <div>
            222
            <div>
                333
            </div>
        </div>
    </div>
"

• $(".parent").val(),返回：

""

所以：

1. .html()用为读取和修改元素的HTML标签。使用在多个元素上时，只读取第一个元素。
2. .text()用来读取或修改元素的纯文本内容，包括其后代元素。不能使用在表单元素上。应用在多个元素上时，将会读取所有选中元素的文本内容。
3. .val()用来读取或修改表单元素的value值。且只能使用在表单元素上。使用在多个元素上时，只读取第一个元素。
4. .html(htmlString),.text(textString)和.val(value)三种方法都是用来替换选中元素的内容，如果三个方法同时运用在多个元素上时，那么将会替换所有选中元素的内容。