zoukankan      html  css  js  c++  java
  • 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:追加-》移出-》切换-》是否含有

  • 相关阅读:
    SSH框架搭建全过程详解
    SpringMVC项目配置全过程详解
    <抽奖奇遇>
    extJS--尚
    CentOS 7.3安装指南
    javaWeb项目之图书管理系统(附视频讲解)
    Swing记事本项目
    五、PTA实验作业(结构体)
    四、PTA实验作业(指针)
    三、PTA实验作业(数组)
  • 原文地址:https://www.cnblogs.com/floraCnblogs/p/jquery.html
Copyright © 2011-2022 走看看