{HTML5}DOM 和 CSS 操作-第二节-设置元素及内容

通过前面所学习的各种选择器、过滤器来得到想要操作的元素。这个时候，就可以对这些元素进行 DOM 的操作。那么，最常用的操作就是对元素内容的获取和修改。

html()和 text()方法

​​

在常规的 DOM 元素中，可以使用 html()和 text()方法获取内部的数据。html()方法可以获取或设置 html 内容，text()可以获取或设置文本内容。

$('#box').html();                               //获取 html 内容

$('#box').text();                               //获取文本内容，会自动清理 html 标签

$('#box').html('<em>www.baidu.com </em>');      //设置 html 内容

$('#box').text('<em>www.baidu.com</em>');       //设置文本内容，会自动转义 html 标签

注意：当我们使用 html()或 text()设置元素里的内容时，会清空原来的数据。而我们期望能够追加数据的话，需要先获取原本的数据。

$('#box').html($('#box').html() + '<em>www.baidu.com</em>');  //追加数据,此方法内容多时不好操作

如果元素是表单的话，jQuery 提供了 val()方法进行获取或设置内部的文本数据。

$('input').val();                                    //获取表单内容

$('input').val('www.baidu.com');            //设置表单内容

如果想设置多个选项的选定状态，比如下拉列表、单选复选框等等，可以通过数组传递操作。

$("input").val(["check1-var名称","check2", "radio1" ]); //value 值是check1(val值)这些的将被选定