jQueryday2容易混淆的知识点简介

jqueryday2容易混淆的知识点，与注意要点

注意区分，属性 和 样式属性 平常说的属性包括id class style lang dir title等，然后注意样式属性指的是设置在 style 属性里面或者 style 标签里面的 ，不要搞混.css() 只能获取是 style 里面的属性值；
注意语法：获取style样式属性值：对象.css(“属性名”），设置style样式属性值：对象.css(“属性名”），设置style样式属性值：对象.css(“属性名”，“属性值”）双引号必不可少

attr，prop 是操作属性，也就是id，class，style，lang，dir，title，alt--------------标签里面的属性

attr：我们自定义的dom属性

2。class操作

1.添加样式

addclass(name);

name:类样式名字

$("li").addclass("bigger");

2.删除样式

.removeclass(name);

name:类样式名字

$("li").removeclass("bigger");

3.判断是否有样式

hasclass(name);

name:类样式名字

$("li").hasclass("bigger");

4.切换类样式

toggleclass(name);

name:类样式名字

$("li").toggleclass("bigger");

3.三种基本动画

 

<script src="jquery-1.12.4.js"></script><script> $(function () { $("input").eq(0).click(function () { $("p").show("fast",function () { console.log("动画借宿了"); }); }); $("input").eq(1).click(function () { $("p").hide("fast",function () { console.log("动画隐藏了"); }); }); $("input").eq(2).click(function () { $("p").slidedown("fast",function () { console.log("动画卷出来"); }); }); $("input").eq(3).click(function () { $("p").slideup("fast",function () { console.log("动画卷出去"); }); }); $("input").eq(4).click(function () { $("p").slidetoggle("fast",function () { console.log("动画卷上卷下切换"); }); }); $("input").eq(5).click(function () { $("p").fadein("fast",function () { console.log("动画淡入"); }); }); $("input").eq(6).click(function () { $("p").fadeout("fast",function () { console.log("动画淡出"); }); }); $("input").eq(7).click(function () { $("p").fadetoggle("fast",function () { console.log("动画淡入淡出切换"); }); }); }) </script>

4.play与load

load与play是dom对象中的，不能用eq()
在出现音频，视频标签谷歌不支持，火狐和ie支持

5.有的对象可以链式操作，有的不能，

6.元素创建与追加

创建：$(”“) 直接$(“html标签代码”)

追加append() 1.$(父级元素).append("创建的子集元素") 2.$("子集元素").appendto("父级元素")

7.注意点

动画函数里面参数animate({属性：值}，数值，“linear”function（）{})
不要忘了linear加引号，对象里面属性与值可加可不加

有的对象可以链式操作，有的不能，

一定要用this

    $(function () {
        $("a").click(function () {
            $("#image").attr("src",$(this).children("img").attr("src"));//将a标签中的小图的attr中的src属性传给给大图的src属性
            $("#des").text($(this).attr("title"));//将a标签中的title属性传给p标签的text方法，它返回的是a标签title属性的值
            return false;
        });

    })
重点注意，在点击事件中一定要用this，如果用this所指的对象名会达不到效果，
因为this指的是当前，而对象由于隐式迭代，它所指的是所有的对象

后代选择器与子代选择器区别：
后代选择器：作用在子代和子代所包含的与其相同标签的所有元素
子选择器：只作用到子代，子代所包含的所有标签都不会作用到

7.清除节点