捕获内容和属性
1.DOM 操作
获得内容 - text()、html() 以及 val()
text() - 设置或返回所选元素的文本内容，如果不带值则是返回值，如果带值则是修改值，如：$('p').text('我要修改原来的文本');
html() - 设置或返回所选元素的内容（包括 HTML 标记）,如果不带值则是返回值，如果带值则是修改值，如：$('p').html("<b>Hello world!</b>");
val() - 设置或返回表单字段的值,如果不带值则是返回值，如果带值则是修改值，如：$('input').val("修改input框的默认value值");
获取属性 - attr() 或 prop()
对于 HTML 元素本身就带有的固有属性，在处理时，使用 prop 方法，如果带有属性值则是修改属性值，如果不带属性值则是返回属性值：如 $('a').attr('href' : 'www.guiqingyuang.com');
对于 HTML 元素我们自己自定义的 DOM 属性，在处理时，使用 attr 方法。
例：<a href="https://www.runoob.com" target="_self" class="btn">少时诵诗书</a>
例子里 <a> 元素的 DOM 属性有: href、target 和 class，这些属性就是 <a> 元素本身就带有的属性，或者说在 IDE 里能够智能提示出的属性，这些就叫做固有属性。处理这些属性时，建议使用 prop 方法。
1.如果有相应的属性，返回指定属性值。
2.如果没有相应的属性，返回值是空字符串。
例：<a href="#" id="link1" action="delete" rel="nofollow">删除</a>
例子里 <a> 元素的 DOM 属性有: href、id 和 action，很明显，前两个是固有属性，而后面一个 action 属性是我们自己自定义上去的，<a> 元素本身是没有这个属性的。处理这些属性时，建议使用 attr 方法。
attr 方法还支持同时修改多个属性，如：<a href="http://www.runoob.com" id="runoob">教程坎坎坷坷</a>
$(document).ready(function(){
$("button").click(function(){
$("#runoob").attr({
"href" : "http://www.runoob.com/jquery",
"title" : "jQuery 教程"
});
// 通过修改的 title 值来修改链接名称
title = $("#runoob").attr('title');
$("#runoob").html(title);
});
});
1.如果有相应的属性，返回指定属性值。
2.如果没有相应的属性，返回值是 undefined。
text()、html() 以及 val() 的回调函数
回调函数有两个参数：被选元素列表中当前元素的下标，以及原始（旧的）值。然后以函数新值返回您希望使用的字符串。
例：$(document).ready(function(){
$("#btn1").click(function(){
$("#test1").text(function(i,origText){ //这里function传两个参数，第一个是下标，第二个参数是原来的值
return "旧文本: " + origText + " 新文本: Hello world! (index: " + i + ")";
});
});
例：$("#btn2").click(function(){
$("#test2").html(function(i,origText){ //这里function传两个参数，第一个是下标，第二个参数是原来的值
return "旧 html: " + origText + " 新 html: Hello <b>world!</b> (index: " + i + ")";
});
});
attr()，也提供回调函数。回调函数有两个参数：被选元素列表中当前元素的下标，以及原始（旧的）值。然后以函数新值返回您希望使用的字符串。
例：$(document).ready(function(){
$("button").click(function(){
$("#runoob").attr("href", function(i, origValue){ //这里function传两个参数，第一个是下标，第二个参数是原来的值
return origValue + "/jquery";
});
});
});
jQuery - 添加元素
添加新的 HTML 内容
添加新内容的四个 jQuery 方法：
- append() - 在被选元素的结尾插入内容 如： $("p").append("追加文本");
- prepend() - 在被选元素的开头插入内容 如： $("p").prepend("在开头追加文本");
- after() - 在被选元素之后插入内容 如： $("img").after("在后面添加文本");
- before() - 在被选元素之前插入内容 如： $("img").before("在前面添加文本");
append() 和 prepend() 方法能够通过参数接收无限数量的新元素。可以通过 jQuery 来生成文本/HTML
例：
$('#lia').click(function(){
var la1 = '<p>文本内容</p>'; // 使用 HTML 标签创建文本
var la2 = $('<div></div>').text('文本内容222'); // 使用 jQuery 创建文本
var la3 = document.createElement('h1');
la3.innerHTML="我是通过dom创建的文本";
$('span').prepend(la1, la2, la3);
});