jQuery-day01-介绍 和 选择器获取元素

 

 

1 ,jQuery介绍

 

1.1，jquery的介绍，javascript库的关系。体验jquery。把js兼容性代码封装在jquery.js中，本身就是一个javascript库。

 

1.2，jQuery对象 和 dom 对象 互转

 

*DOM对象 ！= jQuery对象
*
*dom对象
*var btnObj = doucument.getElementbyId("btn");

*jQuery 对象
*$(btnObj)------dom转jQuery
*
*jQuery转dom
*$(btnObj)[0]-----------------------或者jQuery对象.get(0);

 

 

2，选择器获取元素

 

*1.1、id 选择器
语法： $("#id选择器的值")

*

1.2、标签选择器
语法： $("标签名")
*

1.3、类选择器
语法：$(".类样式名") ，注意前面的点。

1.4、并集选择器
语法：$("div,p,span")，中间使用逗号隔开。
如果上面的 div 有 id 选择器 dv；span 有类选择器 cls；
上面的写法也可以这样写： $("#dv, p, .cls")

1.5，交集选择器
语法：$("div.cls")
标签名 + 类样式的方式。
// 选择所有div标签中class属性名为.cls的所有div元素 同时满足两个条件

1.6、后代选择器
语法：$("div ul span")
选择 div 下面所有 ul 下的所有的 span 标签，不包括 div 下面的 span，必须在 ul 里面。

1.7、子代选择器
语法：$("div>span")
选择 div 的直接下一代的所有span，不能隔代。

1.8、兄弟选择器
语法：$("div~span")
选择的是 div 后面的所有兄弟标签为 span 的标签

1.9、直接兄弟选择器
语法：$("div+span")
选择的是div 后面的直接兄弟标签，如果这个直接兄弟为 span 标签则选中，如果为其他标签则不选中。

 

 

 

3，jquery中的一些方法·

 

1，jQuery对象 中的 .text() ，如果括号中没有值的话，是获取文本内容；如果有值的话，就是设置文本内容。jquery对象 的 text("值")----设置文本

2，元素.html(); html(); // 获取或设置标签的html内容----相当于DOM中的innerHTML

 

3，jQuery中使用 jQuery对象.css("属性":"值"); 的方式设置标签的样式。

 

4， jQuer对象.val();---------表示是获取该元素.value值。jQuer对象.val("值")------设置value值

 

5，show()：设置元素显示，括号中可以写数字，表示过度效果时间（ms）

 

6，hide() ：设置元素隐藏，括号中可以写数字，表示过度效果时间（ms）

 

7，stop()：清除动画效果残留

 

8，find（）；参数为标签名，从当前对象找到符合要求的所有子元素。