jquery学习（三）DOM

1.获取设置内容

text() - 设置或返回所选元素的文本内容
html() - 设置或返回所选元素的内容（包括 HTML 标记）
val() - 设置或返回表单字段的值

不加参数就返回相应的内容，也可以加入相应参数，设置内容。
我们还可以设置回调函数，回调函数由两个参数：被选元素列表中当前元素的下标，以及原始值。

$('div').html(function (i, old) {
   alert(i + old);
});

因为$(‘div’)可能选择多个，下标就是指这个数组的下标。

2.获取设置属性

（1）获取属性值

$(selector).attr(attribute)

（2）设置属性值

$(selector).attr(attribute,value)

（3）设置多个属性值

$(selector).attr({attribute:value, attribute:value ...})

（4）使用函数来设置属性值

$(selector).attr(attribute,function(index,oldvalue))

3.获取设置 CSS 类

（1）addClass()

    向被选元素添加一个或多个类

$("button").click(function(){
  $("#div1").addClass("important blue");
});

（2）removeClass()

    从被选元素删除一个或多个类

（3）toggleClass()

    对被选元素进行添加/删除类的切换操作

4.获取设置css样式

（1）获取css属性

    $(selector).css(name)
    如：$("p").css("color");

如果想获得多个属性值，可以传入数组：

$("div").css(["background-color", "color"]);

（2）设置css属性

$(selector).css(name,value)

（3）使用函数来设置 CSS 属性

$(selector).css(name,function(index,value))

（4）设置多个css属性

$(selector).css({property:value, property:value, ...})

5.dom元素操作

（1）append

$(selector).append(content)
在被选元素的结尾（仍然在内部）插入指定内容。
content：要插入的内容（可包含 HTML 标签）。

$(selector).append(function(index,html))
使用函数在指定元素的结尾插入内容
index - 可选。接收选择器的 index 位置。
html - 可选。接收选择器的当前 HTML。

（2）prepend

在被选元素的开头（仍位于内部）插入指定内容，和append刚好相反。

（3）appendTo

$(content).appendTo(selector)
在被选元素尾部（仍位于内部）追加指定内容，注意前面是内容，后面是被选元素。

（4）prependTo

$(content).prependTo(selector)
在被选元素头部（仍位于内部）追加指定内容。

（5）after

$(selector).after(content)
在被选元素后插入指定的内容。

使用函数来插入内容
$(selector).after(function(index))

（6）before

在被选元素前插入指定的内容，用法和after一样。

（7）insertAfter

$(content).insertAfter(selector)
在被选元素之后插入 HTML 标记或已有的元素。

（8）insertBefore

$(content).insertBefore(selector)
在被选元素之前插入 HTML 标记或已有的元素。

（9）remove

$(selector).remove()
移除被选元素，包括所有文本和子节点。会返回remove的元素。

（10）empty

$(selector).empty()
从被选元素移除所有内容，包括所有文本和子节点。和remove的区别：empty只是清空内容。

（11）detach

$(selector).detach()
移除被选元素，包括所有文本和子节点。detach() 会保留所有绑定的事件、附加的数据，这一点与 remove() 不同。   

（12）wrapInner

$(selector).wrapInner(wrapper)
使用指定的 HTML 内容或元素，来包裹每个被选元素中的所有内容 (inner HTML)。

（13）wrap

$(selector).wrap(wrapper)
把每个被选元素放置在指定的 HTML 内容或元素中。

（14）wrapAll

$(selector).wrapAll(wrapper)
在指定的 HTML 内容或元素中放置所有被选的元素。

（15）unwrap

$(selector).unwrap()
删除被选元素的父元素。

（16）replaceWith

$(selector).replaceWith(content)
用指定的 HTML 内容或元素替换被选元素。
$(selector).replaceWith(function())

（17）replaceAll

$(content).replaceAll(selector)
replaceAll() 与 replaceWith() 作用相同。差异在于语法：内容和选择器的位置，以及 replaceWith() 能够使用函数进行替换。

（18）clone

$(selector).clone(includeEvents)
生成被选元素的副本，包含子节点、文本和属性。