web-day04
# 使用JQuery完成页面定时弹出广告
# 使用JQuery完成表格的隔行换色
# 使用JQuery完成复选框的全选效果
# 使用JQuery完成省市联动效果
# 使用JQuery完成下列列表左右选择
jQuery的概述:是一个JS的框架(JS的类库)
###jQuery的引入
```html
<script src="../../js/jquery-1.11.3.min.js"></script>
```
####JQ的方法只能JQ的对象调用
####JQ与JS的转换
```html
$() //括号内可以传js的对象,可以传选择器,可以传id等
id选择器
用法:$(“#id”)
类选择器
用法:$(“.类名”)
元素选择器
用法:$(“元素名称”)
通配符选择器
用法:$(“*”)
并列选择器
用法:$(“选择器,选择器,选择器”)
层级选择器:
后代选择器:使用空格 所有后代包含孙子及以下的元素
子元素选择器:使用> 第一层的元素(儿子)
下一个元素:使用+ 下一个同辈元素
兄弟元素:使用~ 后面所有的同辈元素
【基本过滤选择器】
```
总结JQuery
```html
JQuery:
* JQuery的概述:是一个轻量级的JavaScript的类库.对JS进行封装.
* 常见的JS的框架:
* JQuery,ExtJS,DWR,Prototype...
* JQuery的使用:
* 引入JQuery的JS.
* window.onload和$(document).ready(function(){});区别?
* onload页面加载完成后才会执行.执行一次
* ready在页面的DOM树绘制完成就会执行.执行多次.
* JS对象与JQuery对象的转换.
* JS-->JQuery: $(JS的对象)
* JQuery-->JS: JQ对象.get(0), JQ对象[0]
* JQuery的选择器:(*****)
* 基本选择器:
* ID选择器,类选择器,元素选择器,通配符选择器,选择器并列.
* 层级选择器:
* 空格 ,> ,+ ,~
* 过滤:
* :first,:last,:eq(),:even,:odd...
* 属性选择器:
* [属性名],[属性名=’属性值’]...
* 表单选择器:
* :input,:text,:password,:radio...
* 可见性:
*
* 表单对象属性:
* :checked,:selected,:enable,:disable
* JQuery实现效果:
* show(),hide(),slideDown(),slideUp(),fadeIn(),fadeOut(),animate()
* JQuery样式操作:
* css();
* JQuery属性操作的方法:
* attr(),removeAttr(),prop(),removeProp(),html(),text(),val(),addClass(),removeClass()
* JQuery文档处理:
* append(),appendTo(),insertBefore(),insertAfter(),remove(),clone(),replaceAll()
* JQuery的事件:
* click(),change(),submit(),dblclick(),keyUp(),keyDown()...
* toggler(),hover() ---进行事件的切换.
```
|
|