Dom操作常用方法
.append()/.prepend()
.append()函数用于向每个匹配元素内部的末尾位置追加指定的内容
.prepend()函数用于向每个匹配元素内部的起始位置追加指定的内容。
指定的内容可以是：html字符串、DOM元素(或数组)、jQuery对象、函数(返回值)。
$("p").append( '<p>插入段落</p>' ) // 插入DOM元素
$('p').append($('strong')) // 插入jQuery对象，如果追加的内容是当前页面中的某些元素，那么这些元素将从原位置上消失。
//简而言之，这相当于一个移动操作，而不是复制操作。
$('p').append(function(index){ // 插入function，函数传入两个参数：第一个参数就//是当前元素在匹配元素中的索引，
第二个参数就是该元素当前的内部html内容(innerHTML)
return '插入段落' + index
})
.before()/.after()
.before()函数用于在每个匹配元素之前插入指定的内容
.after()函数用于在每个匹配元素之后插入指定的内容。
指定的内容可以是：html字符串、DOM元素(或数组)、jQuery对象、函数(返回值)。
$('p').before('<i>somthing</i>')
$('p').after('$('#id')') //插入的内容是当前页面中的某些元素，那么这些元素将从原位置上消失。
//简而言之，这相当于一个移动操作，而不是复制操作。
.remove()/.empty()
.remove()删除被选元素（及其子元素）
.empty()清空被选择元素内所有子元素
$('p').remove()
$('p').empty()
$('p').remove('.class') //通过添加选择器，可以进行过滤删除
.html()/.text()
.html()函数用于设置或返回当前jQuery对象所匹配的DOM元素内innerHTML
.text()函数用于设置或返回当前jQuery对象所匹配的DOM元素内innerText
<div>
<p>段落1</p>
<p>段落2</p>
</div>
$('div').html()
// 返回结果：
"
<p>段落1</p>
<p>段落2</p>
"
$('div').text()
// 返回结果：
"
段落1
段落2
"
属性操作常用方法
.val()
函数用于设置或返回当前jQuery对象所匹配的DOM元素的value值，该函数常用于设置或获取表单元素的value属性值。例如：<input>、<textarea>、<select>、<option>、<button>等。
$('input').val('somthing') //设置所有选中的input的value为somthing。
.attr()/.prop()
.attr()和.prop()函数都用于设置或返回当前jQuery对象所匹配的元素节点的属性值。
两者使用上的区别是：对于HTML元素本身就带有的固有属性，在处理时，建议使用prop方法。对于HTML元素我们自己自定义的DOM属性，在处理时，建议使用attr方法。
<input id="chk1" type="checkbox" action='123' >
// .prop()用于设置或获取指定DOM元素(指的是JS对象，Element类型)上的属性(property)
$("#chk1").prop("action") // undefined
document.querySelector('#chk1').action // undefined
// .attr()用于设置或获取指定DOM元素所对应的文档节点上的属性(attribute)
$('#chk1').attr('action') // '123'
document.querySelector('#chk1').getAttribute('action') // "123"
$("#chk1").prop("checked") // false
$("#chk1").attr("checked") // undefined
document.querySelector('#chk1').checked //false
document.querySelector('#chk1').getAttribute('checked') //null
//勾选checkbox后 .attr()函数不会更新
$("#chk1").prop("checked") //true
$("#chk1").attr("checked") //undefined
document.querySelector('#chk1').checked //true
document.querySelector('#chk1').getAttribute('checked') //null
.removeAttr()
函数用于移除在当前jQuery对象所匹配的每一个元素节点上指定的属性
$('img').removeAttr('alt') //删除所有img标签中的alt属性
.css()
函数用于设置或返回当前jQuery对象所匹配的元素的css样式属性值。
$('div').css('fontSize', '20px') //设置
$('div').css('fontSize') //获取
.addClass() /.removeClass()/.toggleClass()
.addClass()函数用于为当前jQuery对象所匹配的每一个元素添加指定的css类名。
.removeClass() 移除当前jQuery对象所匹配的每一个元素上指定的css类名。
.toggleClass()切换当前jQuery对象所匹配的每一个元素上指定的css类名。
$('div').addClass('clearfix') //增加clearfix类
$('div').removeClass('clearfix') //删除clearfix类
$('div').toggleClass('clearfix') //切换clearfix类
.hasClass()
指示当前jQuery对象所匹配的元素是否含有指定的css类名。返回值是Boolean类型
$('div').hasClass("bar")
其他常用函数
.each()
函数用于以当前jQuery对象匹配到的每个元素作为上下文来遍历执行指定的函数。所谓的上下文，意即该函数内部的this指针引用了该元素。
$("ul li").each(function(index, element){
// this === element
$(element).html( "编号" + (index + 1) );
});
$.extend()
函数用于将一个或多个对象的内容合并到目标对象。
var x = { name:"CodePlayer" };
var y = { age: 18 };
var z = { site: "www.365mini.com" };
// y和z的属性将被合并复制到对象x上
var obj = $.extend( x, y, z );
.clone()
函数用于克隆当前匹配元素集合的一个副本，并以jQuery对象的形式返回
$('div').clone()
.index()
函数用于获取当前jQuery对象中指定DOM元素的索引值。
$('li').index($('li.active'))
.ready()
函数用于在当前文档结构载入完毕后立即执行指定的函数。
$(document).ready( function(){
alert('hello world')
});
