jQuery基础

1. jquery轻量级的库,具有强大的选择器、出色的DOM操作、可靠的事件处理、完善的兼容性和链式操作等功能。

2. 优势:

    轻量级

   强大的选择器

   出色的DOM操作的封装

   可靠的事件处理机制

   完善的Ajax

   不污染顶级变量:$可以随时交出控制权

   出色的浏览器兼容性

   链式操作方式

   隐式迭代

   行为层与结构层的分离

   丰富的插件支持

   完善的文档

   开源

3. DOM(Document Object Model)文档对象模型,DOM分为DOM Core、HTML-DOM、CSS-DOM,获取元素节点,js用getElementById('a'),jquery用$('#a');但是jquery对象中无法使用DOM的任何方法。

 DOM Core:document.getElementsByTagName('form');           element.getAttribute('src');

 HTML-DOM:document.forms;                                                   element.src;

 CSS-DOM:element.style.color;    

4. jquery对象转成DOM对象: a  = $('#a')[0] ; 或者a = $('#a').get(0)  DOM对象转成jquery对象: $b= $(doucument.getElementBtId('b'))

5. jQuery常用的css选择器:标签选择器,ID选择器, 类选择器,群组选择器,后代选择器, 通配选择符。

   选择器详情请见:http://www.cnblogs.com/floraCnblogs/p/html5-css3.html

   常用选择器:

  1)基本选择器(#id; .class;element; *;selector1)、

  2)层次选择器($('div span');$('parent>child');$('prev + next');$('prev~sibling'))、

  3)过滤选择器

    (1基本过滤器(:first;:last;:not(selector);:even(偶数);:odd(奇数);:eq(index);:gt(index);:lt(index);:header;:animated;:focus)、

    (2内容过滤器(:contains(text);:empty;:has(selector);:parent)、

    (3可见性过滤选择器(:hidden;:visible)、

    (4属性过滤选择器([attribute];[attribute=value];[attribute!=value];[attribute^=value];[attribute$=value];[attribute*=value];[attribute|=value];[attribute~=value];[attribute1][attribute2][attribute3])

    (5子元素过滤选择器(:nth-child(index/even/odd/equation);:first-child;:last-child;:only-child)

    (6表单对象属性过滤选择器(:enabled;:disabled;:checked;selected)

  4)表单选择器(:input;:text;:password;:radio;:checkbox;:submit;:image;:reset;:button;:file;:hidden)

6. <input name="testName" id="testId">  getElementsByName('testName')、getElementsByTagName('input')、getElememtId('testId'), 有无s是因为id只能有一个,name和tag可以多个。

7.遍历节点

   1)children()儿女而不是所有后代

   2)next()后面紧邻的同辈元素

   3)prev()前面紧邻的同辈元素

   4)siblings()元素前后所有的同辈元素

   5)colsest()首先检查当前元素是否匹配,如果匹配则直接返回元素本身,如果不匹配则向上找父元素,逐级向上直到找到为止

   6)parent()每个元素的父级元素

   7)parents()每个元素的祖先元素

8. append-》clone-》repalceWith-》wrap-》remove:添加-》复制-》替换-》包裹-》删除-》节点只举了一个

9. addClass-》removeClass-》toggleClass-》hasClass:追加-》移出-》切换-》是否含有

posted @ 2016-07-07 10:30  李晓菲  阅读(154)  评论(0编辑  收藏  举报