一、节点操作

1、创建节点

$("<li title="jQuery">jQuery</li>")

2、插入节点

  • 插入子元素

    append()
    prepend()

    $(selector).append/prepend(content/function(index,html))

  • 插入作为子元素

    appendTo()
    prependTo()

    $(content).appendTo/prependTo(selector)

  • 插入同级元素

    after()
    before()

    $(selector).after/before(content/function(index))

  • 插入作为同级元素

    insertAfter()
    insertBefore()

    $(content).insertAfter/insertBefore(selector)

3、删除节点

  • remove()

    返回一个指向已被删除的节点的引用

  • detach()

    所有绑定的事件、附加的数据等都会保留下来

  • empty()

    不是删除节点，是清空元素中的所有后代节点

4、复制节点clone()

$("ul li").click(function(){
	$(this).clone().appendTo("ul");
});

复制节点后，被复制的新元素并不具有任何行为。如果需要新元素也具有被复制元素的事件处理，则要使用：

$(this).clone(true).appendTo("ul");

5、替换节点

替换选择器选中的元素

  • replaceWith()

    $(selector).replaceWith(content/function())

  • replaceAll()

    $(content).replaceAll(selector)

6、包裹节点

  • wrapAll

    所有匹配的元素用一个元素来包裹

    $(selector).wrapAll(wrapper)

    • before：
      <strong></strong>
  <strong></strong>

      $("strong").wrapAll("<b></b>")
    • after
      <b>
      <strong></strong>
      <strong></strong>
  </b>

  • wrap()

    将所有的元素进行单独的包裹

    $(selector).wrap(wrapper/function())

    • before：
      <strong></strong>
  <strong></strong>

      $("strong").wrap("<b></b>")
    • after
      <b><strong></strong></b>
  <b><strong></strong></b>

  • wrapInner()

    将每一个匹配的元素的子内容(包括文本节点)用其他结构化的标记包裹起来

    $(selector).wrapInner(wrapper/function())

    • before：
      <strong></strong>

      $("strong").wrapInner("<b></b>")
    • after
      <strong><b></b></strong>

7、遍历节点

　children()
　next()
　prev()
　siblings()
　closest()
　parent()
　parents()

二、单选、复选、下拉列表选中

$(":checkbox").val(["check1","check3"]);
$(":radio").val(["radio2"]);

或

$("#single option:eq(1)").attr("selected",true);
$("[value=radio2]:radio").attr("checked",true);