笔记

1.jQuery将DOM里面的属性变成方法。

方法：.css（）作用类似于 $("# ")[0].style.color。而jQuery转换成DOM，$（"# "）[0].

2.选择器

1)基本

1> $("#id") =document.getElementById()   若多个元素一个id,只返回第一个元素。

2> $("")=document.getElementsByTagName()。

3> $(".class")。

4> $("*") 所有元素。

组合之间逗号分隔，取所有条件的结果的并集；若无，则为交集。

2)层次

1>$("div span"),div里所有的span元素（包括直接元素与嵌套的后代元素）。

2>$("div>span"),div里面所有名为span的直接子元素。

3>$(".one+div"),选取class为one的下一个div元素（同一层级）。

4>$("#two~div"),选取id为two的元素后面的所有div兄弟元素。

5>$("prev+next")=$("prev").next("next")。

6>$("prev~subling")=$("prev").nextAll("subling")。

7>$("prev").sublings("next")选取prev同辈的所有next元素。

3.document.getElementById("a");获得id为a的元素

4.生成一个元素document.createElement("input");

input.setAttribute("type","next");

$("div").appendChild(input);将input插入最后一个子节点之后

target.insertBefore(newChild,existingChild)将newChild作为target子节点，插入其他的子节点之前

target.insertAfter(newChild,existingChild)将newChid作为target子节点，插入其他子节点之后

5.删除

remove()，返回被删除的节点的jQuery对象，可以把该值插入其他地方。  返回值，可以有参数。

empty()，删除所有元素的子节点，但是元素本身还在

6.复制

clone(),复制，返回值为被复制的节点。

clone(ture)，复制节点包括所有的事件处理器。

clone(false),复制节点，但不复制事件处理器。若无参数时，则默认为这种情况。

7.替换

replaceAll(),$("content").repalceAll(selector) 用指定HTML内容或元素替换被选元素。

repalceWith,$(selector).repalceWith("content")用新内容替换所匹配的元素。

用已有元素去替换，原来的元素会被移除。

替换节点，可将节点的事件一起放到新地方。

8.包裹节点（把匹配的元素用指定的内容或元素包裹起来，即增加一个父元素）

wrap()，$("#b").wrap(a)  用a将b包裹在里面

wrapAll(),$("#b").wrapAll(a) 用a将所有属于b的包裹在里面

wrapInner(),$("#b").wrapInner(a) 用a将整个文本中的所有b，其中的每一个单独的包裹起来

9.jQuery操作DOM元素

attr()读操作，返回类型String；若不存在，则返回undefined。选择器的结果可能是一个集合，这里仅仅获取集合中第一个元素的该属性的值。

       写操作，返回值jQuery对象，链式方法；若属性不存在，则增加该名字的属性。

键与值之间用“：”，键值对之间用“，”；设置多个属性时，属性名的引号可选，但是类的引号必须有。多个键值对，整体用花括号括起来。

each()与map()，获取集合中的每一个元素的属性。

10.jQuery不可以修改input与button的type属性。

removeAttr(),移除匹配元素中每一个元素的指定属性。

11.jQuery修改class属性与css样式

addClass(),方法想匹配的元素增加一个指定的类名（一个或者多个）。

attr（）方法设置属性是一个覆盖的过程。addClass()则是一个追加过程。

class之间用空号隔开

removeClass()方法从被选元素移除一个或多个类。如需移除多个，用空格来分隔类名。若无参数，该方法将会移除被选元素的所有类。

toggleClass(),改方法检查每一个元素中的指定类，如存在则删除，如不存在则添加。

表单里面鼠标点输入框时，输入框的值清零。移除鼠标点别的时，返回原来的值。

 <script type="text/javascript" src="jquery-1.11.3.js"></script>
  <script type="text/javaScript">
    $(document).ready(function()
    {
        $("#id").focus(function()
        {
            var value = $(this).val();
            if(value == "喜欢你")
            {
                $(this).val("");
            }
        });
        
        $("#id").blur(function()
        {
            var value = $(this).val();
            if(value=="")
            {
                $(this).val("喜欢你");
            }
        });
            
        
    });