一、基本知识

Jquery是什么?
  它就是一套JS方法包,jQuery是一个快速,小巧,功能丰富的JavaScript库。它使得HTML文档遍历和操作,事件处理,动画和Ajax更容易使用易于使用的API,可以工作在众多的浏览器。结合多功能性和可扩展性,jQuery已经改变了数百万人编写JavaScript的方式。
二、选择器

基本选择器:

  基本:

    ID选择器:$("#ID")

    Class选择器:$(".Class")  

    标签选择器:$("标签名")

  组合:

    并列:用逗号隔开 $("#ID1","#ID2","#ID3","#ID4",...)

    后代:用空格隔开 $(".Class Div")

过滤选择器:

  基本过滤:

    首尾:  首个:$(".Class:first")   尾个:$(".Class:last")

    等于:  任意个:$(".Class:eq(索引号)") 或者 $(".Class").eq(索引号)   建议使用第二个,例如循环时取索引号方便

    不等于:大于:$(".Class:gt(索引号)")     小于$(".Class:lt(索引号)")    排除:$(".Class:not(.Class:eq(索引号))")

    奇偶:索引号为奇数:$(".Class:odd")      索引号为偶数:$(".Class:even")

  属性过滤:

    属性名过滤:$(".Class[属性名]")

    属性的名值对过滤:$(".Class[属性名=值]")    $(".Class[属性名!=值]")

  内容过滤:

    文字:$(".Class:contains("字符串")")

    子元素:$(".Class:has(选择器)")

  未来元素:

    $("选择器").live("事件名",function () { });

三、事件

  常规事件

    把JS事件中的on去掉即可;

    复合事件:

      $("选择器").hover(function(){},function(){});      相当于把mouseover()mouseout()合二为一

      $("选择器").toggle(function(){},function(){},function(){},...);    点击事件循环执行

  事件冒泡

    阻止事件冒泡:在事件结束前加上 return false;   例如:

 $("#id").click(function () {
alert("");
return false;
});

四:DOM操作

  操作属性

    获取属性  var s=$("选择器").attr("属性名");

    设置属性  $("选择器").attr("属性名","属性值");

    删除属性  $("选择器").removeAttr("属性名");

  操作样式

    操作内联样式     获取样式  var s=$("选择器").css("样式名");      设置样式  $("选择器").css("样式名","值");

    操作样式表的class   添加class   $("选择器").addClass("class名");

              移除class   $("选择器").removeClass("class名");

添加移除交替class   $("选择器").toggleClass("class名")

  操作内容
    表单元素     取值: var s=$("选择器").val();     赋值:  $("选择器").val("值");

    非表单元素   取值: var s=$("选择器").html();  var s=$("选择器").text();     赋值:  $("选择器").html("内容");   $("选择器").text("内容");

  操作相关元素

    查找    父级:$("选择器").parent();    $("选择器").parents("选择器");

        子级:$("选择器").children("选择器");    $("选择器").find("选择器");

        平级:前面的:$("选择器").prve();    $("选择器").prveAll("选择器");

           后面的:$("选择器").next();    $("选择器").nextAll("选择器");

  操作

    新建: var s=$("Html字符串");

      添加: 内部添加:$("选择器").append($("Html字符串"));

        平级之前添加:$("选择器").before($("Html字符串"));

        平级之后添加:$("选择器").after($("Html字符串"));

    移除:清空内部所有元素: $("选择器").empty();    移除元素本身包含内部的元素: $("选择器").remove();

    复制:var s=$("选择器").clone();

五、动画

JQuery 基本知识,选择器,事件,DOM操作的更多相关文章

  1. 读<jquery 权威指南>[1]-选择器及DOM操作

    今天是小年了,2013马上要过去了,但是学习不能间断啊.最近正在看<jQuery权威指南>,先温习一下选择器和DOM操作. 一.基本选择器 1.table单双行: $(function ( ...

  2. 第25篇 jQuer快速学习(上)---选择器和DOM操作

    这个文章经历的时间比较长,不是因为jQuery比较难,而是东西比较多,真心是个体力活.所以本来想把jQuery做成一篇去写,但由于写的时候发现jQuery发现写成一篇的话过于长,对于阅读起来也不是一个 ...

  3. jquer 事件,选择器,dom操作

    一.jQuery简介 jQuery 是一个 JavaScript 库.(其实就是js,就是封装了,语法上有些不一样) jQuery 极大地简化了 JavaScript 编程. jQuery 库位于一个 ...

  4. jQuery选择器和DOM操作——《锋利的jQuery》(第2版)读书笔记1

    第1章 认识jQuery jQuery有以下优势: 轻量级: 强大的选择器: 出色的DOM操作的封装: 可靠的事件处理机制: 完善的Ajax: 不污染顶级变量: 出色的浏览器兼容性: 链式操作方式: ...

  5. [转]jQuery 选择器和dom操作

    居然是12年的总结.... 文章地址: http://www.cnblogs.com/happyPawpaw/articles/2595092.html JQuery选择器 1.基本选择器 基本选择器 ...

  6. Jquery 事件 DOM操作

    常规事件: 把JS的事件  on去掉即可 例如:js    document.getElementById("id").onclinck=function(){} Jquery   ...

  7. jQuery 1.0 | 选择器 | 事件 | 操作样式 | 操作属性

    使用jQuery: 1,下载jQuery http://jquery.com/download/ 2,引入jQuery文件 3,定义入口函数 <script src="jquery-1 ...

  8. 前端笔记之jQuery(下)事件&节点操作&净位置&拖拽&页面卷动值&遍历JSON

    一.监听事件大全 1.1 JavaScript事件 onblur 元素失去焦点 onchange 用户改变域的内容 onclick 鼠标点击某个对象 ondblclick 鼠标双击某个对象 onfoc ...

  9. jQuery初识之选择器、样式操作和筛选器(模态框和菜单示例)

    一.jQuery 1.介绍 jQuery是一个快速.简洁的JavaScript框架,是继Prototype之后又一个优秀的JavaScript代码库(或JavaScript框架). jQuery设计的 ...

  10. jQuery基础知识--选择器与效果

    $(this).hide()-----隐藏当前元素 $("p").hide()------隐藏所有段落 $(".test").hide()--隐藏所有class ...

随机推荐

  1. 编写自己的代码库(javascript常用实例的实现与封装)[转]

    1.前言 因为公司最近项目比较忙,没那么多空余的事件写文章了,所以这篇文章晚了几天发布.但是这也没什么关系,不过该来的,总是会来的.好了,其他的不多说的,大家在开发的时候应该知道,有很多常见的实例操作 ...

  2. Object.defineProperty方法 使用

    Object.defineProperty() 方法会直接在一个对象上定义一个新属性,或者修改一个对象的现有属性, 并返回这个对象. 语法: Object.defineProperty(obj, pr ...

  3. Java 集合-Arrays工具类的介绍

    2017-10-31 18:39:46 Arrrays工具类:此类包含用来操作数组(比如排序和搜索)的各种方法. 常用方法: 主要是数组的一些常用方法如: asList:将数组转成集合 binaryS ...

  4. C# 中的集合(Array/ArrayList/List<T>/HashTable/Dictionary)

    int [] numbers = new int[5]; // 长度为5,元素类型为 int. string[,] names = new string[5,4]; // 5*4 的二维数组 byte ...

  5. Confluence 6 为用户管理连接 Confluence 到 Crowd

    你可以连接你的 Confluence 应用程序到 Atlassian Crowd 或 a Jira (5.3 及后续版本)来管理你的用户和用户组以及针对他们的授权. Atlassian Crowd 是 ...

  6. Bata验收互评

    小组的名字和链接 优点 缺点,bug报告 最终名次 编程题全队 ①限制用户重复注册同一个邮箱②注册之后可以弹出用户名,不用手动输入③细节考虑到位④面板可拖动,增删改查,还能添加成员 Q1:程序有什么具 ...

  7. Activiti工作流笔记(2)

    1.Activiti工作数据表 Activiti用来存放流程数据的表共使用23张表,表名都是以"ACT_"开头,底层操作默认使用mybatis操作 工作流Activiti的表是用来 ...

  8. iOS UI-IOS开发中Xcode的一些使用技巧

    一.快捷键的使用 经常用到的快捷键如下: 新建 shift + cmd + n     新建项目 cmd + n             新建文件 视图 option + cmd + 回车 打开助理编 ...

  9. OC Foundation框架—结构体

    一.基本知识 Foundation—基础框架.框架中包含了很多开发中常用的数据类型,如结构体,枚举,类等,是其他ios框架的基础. 如果要想使用foundation框架中的数据类型,那么包含它的主头文 ...

  10. python中字符串连接的四种方式

    以下实例展示了join()的使用方法 #!/usr/bin/python str = "-"; seq = ("a", "b", " ...