码迷,mamicode.com
首页 > Web开发 > 详细

jquery概要--基础01

时间:2014-11-30 00:12:19      阅读:275      评论:0      收藏:0      [点我收藏+]

标签:des   style   io   ar   color   使用   sp   for   on   

 

1.获取节点:

 

* 上一层:parent();
* 下一层:children();
* 相邻下:next();
* 相邻所有:siblings();

 

2.后代节点:$(‘a b‘),$(‘a>b‘)
兄弟节点:$(‘a~b‘)$(‘a+b‘)
3.jquery对象->DOM对象
var $cr = $(‘#cr‘);
var cr = $cr[0]; /var cr = $cr.get(0);
4.DOM对象->jquery对象.
var cr = document.getElementById(‘cr‘);
var $cr = $(cr);

 

5.JQ与其他库一起使用会有冲突的时候:

 

* JQ先导入:使用‘jQuery()‘替代‘$()‘;其他库可以使用$()
* JQ后导入:使用jQuery(function($){内部可以继续使用‘$()‘});其他库可以使用$()

 

6.$(‘a‘):jquery获取的是永远的对象,即使没有这个对象也不会报错;所以判断的方法为:

 

* if($(‘a‘).length>0){}
* 或转化为DOM判断:if($(‘a‘)[0]){}

 

5.基本选择器:$(‘#one‘);$(‘.mini‘);$(‘div‘);$(‘*‘);$(‘span,#tow‘)
6.层次选择器:$(‘ancestor descendant‘);$(‘parent>child‘);$(‘prev+next‘);$(prev~sibiling).
等价:$(‘.one+div‘) === $(‘.one‘).next(‘div‘);$(‘#prve~div‘)===$(‘#prve‘)nextAll(‘div‘)
$(‘#prev‘).siblings(‘div‘)//同辈所有的。
7.过滤选择器 //一般情况下过滤器的内容已经为字符串无需再加引号

 

* 基本过滤选择器:

 

:first,:last,:not(selector),:even,:odd,:eq(index),:gt(index),:lt(index)//index从0开始
:header//所有标题元素,一般冒号前无元素,
:animated//当前正在执行动画的所有元素,
:focus//当前获得焦点的元素

 

* 内容过滤选择器:

 

:contains(text)
:empty //不包含子元素(包括空格、换行)
:has(selector), :parent //含有子元素

 

* 可见性过滤选择器:

 

:hidden,:visible

 

* 属性过滤选择器:

 

[attr],[attr=value],[attr!=value],[attr^=value],[attr$=value]
[attr*=value]//attr属性值含有value,[attr|=value]//attr属性值等于value或以value前缀(后面跟‘-‘)
[attr~=value]//value左右无其他字符串(包括开头结尾或直接等价),[attr1][attr2=value]//同时满足

 


* 子过滤选择器:(这个过滤器返回的是子元素)

 

:first-child,:last-child,:only-child //不唯一不匹配
:nth-child(even/odd),:nth-child(index)//index从1开始,:nth-child(2*index)//2的倍数,:nth-child(3*index+1)

 

* 表单对象属性过滤选择器:

 

:enabled,:disabled//设置disable=‘disable‘,:checked//单选(radio),复选框(checkbox),:selected//下拉框
8.表单选择器
:input//所有<input><textare><select><button>元素,:text//单行文本框,
:radio,:checkbox,:submit,:image,:reset,:button,:file,:hidden
9.选择器中的一些注意事项:

 

* 选择器中含有特殊字符:如#(].等注意在转义,因为在字符串内,使用双反斜杠\\
* 注意空格

 

10.筛选:filter()//自身集合中查找,find()//子集中查找
11.DOM操作分类:

 

* DOM Core:任何支持DOM的语言都可以使用 如:document.getElementById();elem.setAttribute();
* HTML-DOM:使用js和dom为html编写脚本时 如:document.fomes; elem.src;
* CSS-DOM:针对css的操作 如: elem.style.color;

 

12 属性操作:
获得属性:单个attr(‘‘);多个attr(‘‘,‘‘,‘‘);
设置属性:单个attr(‘‘:‘‘); 多个attr({‘‘:‘‘,‘‘:‘‘});
删除属性:removeAttr();

 

13.节点
元素,文本:直接创建$(),动态插入。
14.插入节点: 名字短的方法都是将原节点放在前,新节点放在在后;

 

* 成为最后一个子节点:append,appendTo;
* 成为第一个子节点:prepend,prependTo;
* 成为后一个节点:after,insertAfter;
* 成为前一个节点:before,insertBefore;

 

15.删除节点:

 

* remove();

 

删除的包括其以及其全局子元素;
返回一个该节点的引用,所以还可以继续使用,但注意其原本绑定的事件,附加的数据都会删除。
对于节点集合,还可以使用参数过滤要删除的节点;

 

* detach();

 

效果与remove()相同,区别是会保留其原本绑定的事件和附加的数据。

 

* empty();

 

清空元素所有的子节点,包括绑定的事件,附加的数据;
没有返回引用;
没有参数过滤;

 

 

jquery概要--基础01

标签:des   style   io   ar   color   使用   sp   for   on   

原文地址:http://www.cnblogs.com/jinkspeng/p/4132159.html

(0)
(0)
   
举报
评论 一句话评论(0
登录后才能评论!
© 2014 mamicode.com 版权所有  联系我们:gaon5@hotmail.com
迷上了代码!