jQuery开发速查手册

合集下载

jQuery Mobile中文手册

jQuery Mobile中文手册

jQuery Mobile开发入门手册——入门篇作者:张勇辉更新日期2010-11-03Blog:目录jQuery Mobile开发入门手册——入门篇 (1)概述 (3)框架特性 (3)版本约定 (3)初始配置 (4)页面声明 (4)技术理论 (4)WebKit 和HTML5 (4)移动Web 应用程序的考虑 (5)一般站点的呈现 (5)组件 (7)页面 (7)模态对话框 (8)工具条 (9)标题容器 (9)页脚容器 (10)导航 (11)按钮 (11)表单应用 (13)列表应用 (14)概述此文档是基于jQuery Mobile框架的移动设备Web应用开发知识而编制,目的是为了方便开发人员快速的掌握此框架的开发应用,其中包含了框架的基础应用知识和在团队协作开发中的常规约定。

框架特性JQuery Mobile以“Write Less, Do More”作为目标,为所有的主流移动操作系统平台提供了高度统一的UI框架:jQuery的移动框架可以让你为所有流行的移动平台设计一个高度定制和品牌化的Web应用程序,而不必为每个移动设备编写独特的应用程序或操作系统。

jQuery Mobile目前支持的移动平台有苹果公司的iOS(iPhone,ipad,iPod Touch),Android,Black Berry OS6.0,惠普WebOS,Mozilla的Fennec和Opera Mobile。

今后,将增加包括Windows Mobile,Symbian和MeeGo在内的更多移动平台。

根据jQuery Mobile项目网站,目前jQuery Mobile的特性包括:•jQuery核心——与jQuery桌面版一致的jQuery核心和语法,以及最小的学习曲线。

•兼容所有主流的移动平台——iOS、Android、BlackBerry,Palm WebOS、Symbian、Windows Mobile、BaDa、MeeGo以及所有支持HTML的移动平台。

jq的用法 -回复

jq的用法 -回复

jq的用法-回复jq是一种非常强大且灵活的命令行工具,它被广泛用于处理和操作JSON 数据。

无论是对于开发人员还是数据分析师,使用jq可以方便地从复杂的JSON数据中提取和转换所需的信息。

本文将介绍jq的基本用法,从安装、基本语法、过滤器、函数以及实际应用等方面进行详细解析。

1. 安装jq要开始使用jq,首先需要在计算机上安装该工具。

jq可以在各个操作系统上安装,例如在Linux上使用包管理器如apt-get或yum进行安装,在Mac上使用Homebrew进行安装,在Windows上可以通过下载二进制文件安装。

安装完毕后,可以使用jq命令来运行。

2. 基本语法jq的基本语法非常简洁易懂,它通过管道接受JSON数据,并使用类似于JavaScript的语法来进行操作和过滤。

例如,要从一个JSON对象中提取特定字段的值,可以使用以下语法:cat data.json jq '.field'这将返回JSON对象中名为"field"的字段的值。

注意,jq只处理标准输入(stdin),因此需要通过管道或重定向将JSON数据传递给jq。

3. 过滤器jq使用过滤器来选择和操作JSON数据。

过滤器是一种表达式,可以根据需要进行嵌套和组合。

例如,要选择某个JSON数组中所有元素的某个字段,可以使用以下语法:.[].field其中"[]"表示选择数组中的所有元素,"field"表示要提取的字段。

通过嵌套选择器,还可以更进一步提取更深层次的数据。

4. 函数jq提供了许多内置的函数,可以进一步处理和转换JSON数据。

这些函数可以用于对数据进行操作、计算和格式化等。

例如,可以使用"map"函数对一个JSON数组中的每个元素进行处理:map(.field + 1)这将返回一个新的JSON数组,其中的每个元素的"field"字段值加1。

Jquery Jqgrid使用手册

Jquery Jqgrid使用手册

一、电子信息技术 (2)(一)软件.................................................................................................... 错误!未定义书签。

(二)微电子技术 ...................................................................................... 错误!未定义书签。

(三)计算机及网络技术 ............................................................................ 错误!未定义书签。

(四)通信技术............................................................................................ 错误!未定义书签。

(五)广播电视技术 .................................................................................. 错误!未定义书签。

(六)新型电子元器件 ................................................................................ 错误!未定义书签。

(七)信息安全技术 .................................................................................... 错误!未定义书签。

(八)智能交通技术 .................................................................................... 错误!未定义书签。

jQuery速查表

jQuery速查表

对 象 访 问
context eq(positon) get() get(index) index(subject) data(name)
数 据 缓 存
data(name,value) removeData(name) queue() queue(callback) queue(queue) dequeue()
层 级
基 本 过 滤 器
内 容 过 滤 器 表 单 过 滤 器
可见 :hidden 过 滤器 :visible
[attribute] [attribute=value] 属 性 过 滤 器 [attribute!=value] [attribute^=value] [attribute$=value] [attribute*=value] [attributeFilter1] [attributeFilter2] [attributeFilterN] 子 元 素 过 滤 器 :nthchild(index/even/odd/equ ation) :first-child :last-child :only-child :input :text :password :radio :checkbox 表 单 :submit :image :reset :button :file :hidden G.3 分类 属性 方法名称 attr(name) attr(properties) 属性 attr(key,value) attr(key,fn) removeAttr(name)
G.1 分类
基础 方法名称 jQuery(expression,[conte nt]) jQuery(html,[owner Document]) jQuery(element) jQuery(callback) each(callback) length/size() selector

jQuery开发手册

jQuery开发手册

别(修裹队ref]修在个 别(修裹队ref次和像和]修在个 别(修裹队ref传次和像和]修在个 别(修裹队ref别次和少面p错和]修在个
面缩uery个焦能能个
面缩uery个焦能能个 个p个

个画至符程个 个焦能能个 个 个
别(修p修在少都ss(修速身都颜错roun量-都o首or修始修re量修在检个 至看Y个

个都首身ss次修test修个 个需量次修test修个 个藏P身t队个 个焦能能个 个 个


个面缩uery个 re身量y个 个
个量o都u高ent个
别(量o都u高ent在少re身量y(fun都t需on(在{个 个 ---个面缩uery个fun都t需ons个错o个队ere个----个 个 }在检个 个面缩uery个 个 个
个面缩uery个 个
面缩uery个 个码身v身能都r需pt个 个面缩uery个 个 个面缩uery个 个
<队e身量毫个 <s都r需pt个type次修text属面身v身s都r需pt修个sr都次修面鼠uery少面s修毫<属s都r需pt毫个 <属队e身量毫个 <s都r需pt毫个 个<队e身量毫个 个
个面缩uery个
个 个 个 个 个
(se首e都tor在个面缩uery个
个 个面缩uery个 个面缩uery个• • Nhomakorabea个
Previous Page Next Page
面缩uery个

面缩uery个

个 落紧落传个
激e都身use个t需高e个需s个v身首u身速首e始个we个量e首需ver个鼠u需都颜个身n量个e身sy个首e身rn需n错少个
面缩uery个

jq命令用法 -回复

jq命令用法 -回复

jq命令用法-回复JQ命令的用法是什么?JQ是一个实用的命令行工具,用于处理和转换JSON数据。

它提供了一组强大的功能,可以通过简洁的命令实现对JSON数据的查询、过滤、转换等操作。

无论是处理单个JSON对象还是大量JSON数据,JQ都能够高效地完成任务。

在本文中,我们将一步一步地介绍JQ命令的用法。

我们将从安装JQ开始,然后学习如何进行基本的JSON查询和过滤,接着探讨如何使用JQ进行JSON数据转换和格式化,最后介绍一些高级用法和技巧。

第一步:安装JQ在使用JQ之前,我们需要先安装它。

JQ可在多个操作系统上安装,包括Linux、macOS和Windows。

下面是在一些常见操作系统上安装JQ的方法:- 对于Ubuntu或Debian系统,可以使用以下命令安装JQ:sudo apt-get install jq- 对于CentOS或Fedora系统,可以使用以下命令安装JQ:sudo yum install jq- 对于macOS系统,可以使用以下命令通过Homebrew安装JQ:brew install jq- 对于Windows系统,可以从JQ的官方网站(安装完成后,可以通过在终端中输入以下命令来验证JQ是否安装成功:jq version如果成功安装,将显示JQ的版本信息。

第二步:基本查询和过滤现在让我们来学习一些最基本的JQ查询和过滤操作。

假设我们有一个名为data.json的JSON文件,其中包含了一些用户的个人信息,其中一个示例数据如下:{"users": [{"name": "Alice","age": 28,"email": "alice@example"},{"name": "Bob","age": 32,"email": "bob@example"},{"name": "Charlie","age": 45,"email": "charlie@example"}]}要从这个JSON数据中提取特定的信息,我们可以使用JQ的查询语法。

jquery属性速查

jquery属性速查

Jquery 速查表核心∙jQuery 核心函数o jQuery(expr, [context])o jQuery(html, [ownerDoc])o jQuery(html, props)o jQuery(elements)o jQuery()o jQuery(callback)∙jQuery 对象访问o each(callback)o size()o lengtho selectoro contexto get()o get(index)o index(subject)∙数据缓存o data([name], [value])o data(obj)o removeData(name)o$.data([el], [key], [val])∙队列控制o queue(name ,[cb|queue])o dequeue(name)o clearQueue([queueName])∙插件机制o jQuery.fn.extend(object)o jQuery.extend(object)∙多库共存o jQuery.noConflict([ex])属性∙属性o attr(name)o attr(properties)o attr(key, value)o attr(key, fn)o removeAttr(name)∙CSS 类o addClass(class | fn)o removeClass([class | fn])o toggleClass(class|fn [, sw])∙HTML代码/文本/值o html( [val | fn] )o text( [val | fn] )o val( [val | fn | arr] )CSS∙CSSo css(name)o css(properties)o css(name, value | fn)∙位置o offset([coordinates])o position()o scrollTop( [val] )o scrollLeft( [val] )∙尺寸o height( [val] )o width( [val] )o innerHeight()o innerWidth()o outerHeight(options)o outerWidth(options)选择器∙基本o#ido elemento.classo*o selector1,selector2,selectorN ∙层级o ancestor descendanto parent > childo prev + nexto prev ~ siblings∙基本o:firsto:lasto:noto:eveno:oddo:eqo:gto:lto:headero:animated∙内容o:containso:emptyo:haso:parent∙可见性o:hiddeno:visible∙属性o[attribute]o[attribute=value]o[attribute!=value]o[attribute^=value]o[attribute$=value]o[attribute*=value]o[attrSel1][attrSel2][attrSelN]∙子元素o:nth-childo:first-childo:last-childo:only-child∙表单o:inputo:texto:passwordo:radioo:checkboxo:submito:imageo:reseto:buttono:fileo:hidden∙表单对象属性o:enabledo:disabledo:checkedo:selected文档处理∙内部插入o append(content | fn)o appendTo(content)o prepend(content | fn)o prependTo(content)∙外部插入o after(content | fn) o before(content | fn) o insertAfter(content) o insertBefore(content)∙包裹o wrap(html)o wrap(elem)o wrap(fn)o unwrap()o wrapAll(html)o wrapAll(elem)o wrapInner(html)o wrapInner(elem)o wrapInner(fn)∙替换o replaceWith(content) o replaceAll(selector)∙删除o empty()o remove([expr])o detach([expr])∙复制o clone()o clone(true)筛选∙过滤o eq(index)o first()o last()o hasClass(class)o filter(expr | fn) o is(expr)o map(callback)o has(expr)o not(expr)o slice(start, [end])∙查找o children([expr])o closest([expr])o find(expr)o next([expr])o nextAll([expr])o nextUntil([expr])o offsetParent()o parent([expr])o parents([expr])o parentsUntil([expr])o prev([expr])o prevAll([expr])o prevUntil([expr])o siblings([expr])∙串联o add(expr, [context])o andSelf()o contents()o end()事件∙页面载入o ready(fn)∙事件处理o bind(type, [data], fn)o one(type, [data], fn)o trigger(type, [data])o triggerHandler(type, [data])o unbind([type], [data])∙事件委派o live(type, [data], fn)o die([type], [fn])∙事件切换o hover(over, out)o toggle(fn, fn2, [fn3, fn4, ...])∙事件o blur( [fn] )o change( [fn] )o click( [fn] )o dblclick( [fn] )o error( [fn] )o focus( [fn] )o focusin( [fn] )o focusout( [fn] )o keydown( [fn] )o keypress( [fn] )o keyup( [fn] )o mousedown(fn)o mousemove(fn)o mouseout(fn)o mouseover(fn)o mouseup(fn)o resize(fn)o scroll(fn)o select( [fn] )o submit( [fn] )o unload(fn)效果∙基本o show()o show(speed, [callback])o hide()o hide(speed, [callback])o toggle()o toggle(switch)o toggle(speed, [callback])∙滑动o slideDown(speed, [callback])o slideUp(speed, [callback])o slideToggle(speed, [callback])∙淡入淡出o fadeIn(speed, [callback])o fadeOut(speed, [callback])o fadeTo(speed, opacity, [fn])∙自定义o animate(param,[dur],[e],[fn])o animate(params, options)o stop([clearQueue], [gotoEnd])o delay(duration, [queueName])∙设置o jQuery.fx.offAjax∙Ajax 请求o$.ajax([options])o load(url, [data], [callback])o$.get(url, [data], [fn], [type]) o$.getJSON(url, [data], [fn])o$.getScript(url, [callback])o$.post(url, [data], [fn], [type])∙Ajax 事件o ajaxComplete(callback)o ajaxError(callback)o ajaxSend(callback)o ajaxStart(callback)o ajaxStop(callback)o ajaxSuccess(callback)∙其它o$.ajaxSetup([options])o serialize()o serializeArray()工具∙浏览器及特性检测o$.supporto$.browsero$.browser.versiono$.boxModel∙数组和对象操作o$.each(object, [callback])o$.extend([d],tgt,obj1,[objN])o$.grep(array, fn, [invert])o$.makeArray(obj)o$.map(array, callback)o$.inArray(value, array)o$.toArray()o$.merge(first, second)o$.unique(array)o$.parseJSON(json)∙函数操作o$.noopo$.proxy(function, scope)∙测试操作o$.contains(container, contained) o$.isArray(obj)o$.isFunction(obj)o$.isEmptyObject(obj)o$.isPlainObject(obj)∙字符串操作o$.trim(str)∙URLo$.param(obj, [traditional])∙插件编写o$.error(message)。

jq基本用法 -回复

jq基本用法 -回复

jq基本用法-回复jq是一个功能强大的命令行工具,用于处理JSON数据。

它可以非常高效地过滤、查询、修改和转换JSON数据。

本文将介绍jq的基本用法,通过一步一步的实例来说明jq如何进行查询和转换操作。

第一步:安装jq首先,我们需要安装jq工具。

jq可以在Windows、Mac和Linux系统上运行。

在大多数Linux发行版上,可以使用包管理器直接安装jq。

例如,在Debian或Ubuntu上,可以使用以下命令进行安装:sudo apt-get install jq在Mac系统上,可以使用Homebrew进行安装:brew install jq安装完成后,我们就可以使用jq命令了。

第二步:使用jq进行简单的查询我们来看一个简单的例子。

假设我们有一个包含学生信息的JSON文件,内容如下:{"students": [{"name": "Tom","age": 18,"grade": "A"},{"name": "Alice","age": 17,"grade": "B"},{"name": "Bob","age": 16,"grade": "C"}]}我们想要查询所有学生的姓名和年龄。

可以使用jq的"."操作符来获取JSON对象中的属性。

例如,要查询所有学生的姓名和年龄,可以运行以下命令:cat students.json jq '.students[] {name, age}'这个命令的意思是从students.json文件中读取JSON数据,然后使用jq 进行处理。

JQuery元素快速查找与操作

JQuery元素快速查找与操作

JQuery元素快速查找与操作⾸先,我们来看看jquery中如何查找到想要的结点。

第⼀步:sizzle选择器基于元素的id、类、类型、属性、属性值等"查找"(或选择)HTML元素,简单的说是基于css选择器,除此之外还有⼀些特定的选择器。

第⼆步:查询祖先parent()返回被选元素的直接⽗元素,该⽅法只会向上⼀级对 DOM 树进⾏遍历parents()可以使⽤可选参数来过滤对⽗元素的搜索返回被选元素的所有祖先元素,它⼀路向上直到⽂档的根元素parentsUntil()返回介于两个给定元素之间的所有祖先元素,下⾯是例⼦:$(document).ready(function(){//会返回span开始到div为⽌的祖先元素$("span").parentsUntil("div");});第三步:查询⼦孙children()可以使⽤可选参数来过滤对⼦元素的搜索返回被选元素的所有直接⼦元素,该⽅法只会向下⼀级对 DOM 树进⾏遍历find()可以使⽤可选参数来过滤对元素的搜索返回被选元素的后代元素,⼀路向下直到最后⼀个后代第四步:查询同胞siblings()返回被选元素的所有同胞元素next()返回被选元素的下⼀个同胞元素nextAll()返回被选元素的之后的全部同胞元素nextUntil()返回介于两个给定参数之间的所有跟随的同胞元素$(document).ready(function(){//返回介于 <h2>与<h6>元素之间的所有同胞元素$("h2").nextUntil("h6");});prev()、prevAll() 和 prevUntil()prev()、prevAll()以及prevUntil()⽅法的⼯作⽅式与上⾯的⽅法类似,只不过⽅向相反⽽已:它们返回的是前⾯的同胞元素(在DOM 树中沿着同胞之前元素遍历,⽽不是之后元素遍历)。

JQuery入门、手册及教程

JQuery入门、手册及教程

浅谈JQUREY(摘自/softwave/article/details/2070815)JQUERY手册(第七页,附教程)Jquery是继prototype之后又一个优秀的Javascript框架。

对prototype我使用不多,简单了解过。

但使用上jquery 之后,马上被她的优雅吸引住了。

有人使用这样的一比喻来比较prototype和jquery:prototype就像Java,而jquery 就像ruby.实际上我比较喜欢java(少接触Ruby罢了)但是jquery的简单的实用的确有相当大的吸引力啊!在项目里我把jquery作为自已唯一的框架类包。

使用其间也有一点点心得,其实这些心得,在jquery的文档上面也可能有讲,不过还是记下来,以备忘罢。

一,找到你了!还记得$()这个东西吧?prototype还是DWR都使用了这个函数代替document.getElementById()。

没错,jquery也跟风了。

为达到document.getElementById()的目的,jquery是这样写的:Java代码1.var someElement = $("#myId");[java]view plaincopyprint?1.var someElement = $("#myId");看起来比其他两个框架的要多了一个#,好,看看下面的用法:Java代码1.$("div p");(1)2.$("div.container")(2)3.$("div #msg");(3)4.$("table a",context);(4)[java]view plaincopyprint?1.$("div p");(1) $("div.container")(2) $("div #msg");(3) $("table a",context);(4)在prototype里看过这样的写法吗?第一行代码得到所有<div>标签下的<p>元素。

jQuery参考手册(全)

jQuery参考手册(全)
<html> <head> <script type="text/javascript" src="jquery.js"></script> <script type="text/javascript"> $(document).ready(function(){
$("button").click(function(){
jQuery 参考手册
在 W3School,您将找到包含所有 jQuery 对象和函数的完整参考手册:
选择器 事件 效果 文档操作 属性 CSS AJAX 遍历 数据 DOM 元素 核心
jQuery 选择器
选择器
实例
*
$("*")
#id
$("#las tname")
.class
$(".intro")
$("#intro")
$("ul li:first")
当前 HTML 元素 所有 <p> 元素 所有 class="intro" 的 <p> 元素 所有 class="intro" 的元素 id="intro" 的第一个元素 每个 <ul> 的第一个 <li> 元素
$("[href$='.jpg']") $("div#intro .head")
:input
$(":input")
所有 <input> 元素

jQuery使用手册

jQuery使用手册

jQuery使用手册目录1 前言 (4)2 核心部分 (4)$(expr) (4)$(elem) (5)$(elems) (6)$(fn) (6)$(obj) (6)each(fn) (7)eq(pos) (7)get() get(num) (8)index(obj) (8)size() Length (8)3 DOM操作 (9)属性 (9)herf() herf(val) (9)after(html) 在匹配元素后插入一段html (9)after(elem) after(elems) 将指定对象elem或对象组elems插入到在匹配元素后 . 10append(html)在匹配元素内部,且末尾插入指定html (10)appendTo(expr) 与append(elem)相反 (10)clone() 复制一个jQuery对象 (10)empty() 删除匹配对象的所有子节点 (11)insertAfter(expr) insertBefore(expr) (11)prepend (html) prepend (elem) prepend (elems) 在匹配元素的内部且开始出插入 (11)remove() 删除匹配对象 (11)wrap(elem) 将匹配对象包含在给出的对象内 (12)遍历、组合 (12)add(expr) 在原对象的基础上在附加符合指定表达式的jquery对象 (12)add(el) 在匹配对象的基础上在附加指定的dom元素。

(12)add(els) 在匹配对象的基础上在附加指定的一组对象,els是一个数组。

(12)ancestors () 一依次以匹配结点的父节点的内容为对象,根节点除外(有点不好理解,看看下面例子就明白了) (13)ancestors (expr) 在ancestors()的基础上之取符合表达式的对象 (13)children() 返回匹配对象的子介点 (13)children(expr) 返回匹配对象的子介点中符合表达式的节点 (13)parent () parent (expr)取匹配对象父节点的。

jqfind方法

jqfind方法

jqfind方法jqfind方法是一种基于jQuery的查找方法,它可以帮助我们快速定位和获取指定的HTML元素或元素集合。

在本文中,我将详细介绍jqfind方法的使用和一些常见的应用场景。

我们需要了解jqfind方法的基本语法。

它的语法如下:```javascript$(selector).find(filter)```其中,`selector`是需要查找的元素的选择器,而`filter`是可选参数,用于对查找结果进行进一步筛选。

`filter`可以是选择器、元素或函数。

接下来,我将通过几个实例来演示jqfind方法的用法。

1. 使用选择器查找元素```javascript$("ul").find("li")```上述代码将返回`ul`元素下的所有`li`元素。

2. 使用元素查找元素```javascript$("ul").find($("li"))```上述代码与第一个实例类似,只是使用了元素作为参数。

这种写法在某些场景下更加灵活和方便。

3. 使用函数查找元素```javascript$("ul").find(function(index, element){return $(element).attr("data-value") === "1";})```上述代码将返回`ul`元素下`data-value`属性值为1的元素。

除了基本的用法,jqfind方法还可以与其他jQuery方法结合使用,以实现更多的功能。

下面是一些常见的应用场景:1. 查找子元素```javascript$("ul").find("li.child")```上述代码将返回`ul`元素下所有class为`child`的`li`元素。

2. 查找兄弟元素```javascript$("ul").find("li.sibling").siblings()```上述代码将返回`ul`元素下class为`sibling`的`li`元素的所有兄弟元素。

jQuery完全手册

jQuery完全手册

jQuery完全手册jQuery是一种流行的JavaScript库,它允许开发者以更简单的方式对HTML文档进行操作。

jQuery提供了许多有用的功能,比如DOM操作、事件处理、动画效果等等。

本文将介绍jQuery的完整手册,包括其语法、文档对象模型、事件和效果。

一、语法jQuery语法非常简单,并且易学易用。

它是基于CSS选择器的,可以通过选中所有类似文本的元素来实现功能。

例如:$(document).ready(function(){$(\"button\").click(function(){$(\"p\").hide();});});上面的代码意思是,当文档加载完毕时执行一个函数,然后当按钮被点击时隐藏所有段落元素。

几个重要的jQuery语法如下:1. $(selector).action():这是最基本的语句,它为jQuery选择器选择元素,并对它们执行某个操作。

2. $(document).ready(function(){}):这个语句表示文档已经加载完毕,可以执行代码了。

3. $(this):这个语句用于获取当前元素。

4. $(selector).each(function(){}):这个语句用于迭代一个选择器匹配的元素集合,并为每个元素执行一个函数。

二、文档对象模型jQuery有一个强大的文档对象模型,可以使您轻松地遍历和操作HTML元素和属性。

在jQuery中,文档对象模型由以下内容组成:1. 选择器:通过选择器可以选择文档中的元素,其语法类似于CSS选择器。

2. 属性操作:设置和获取元素的属性值。

3. 样式操作:设置和获取元素的样式。

4. HTML操作:可以操作元素的HTML内容。

5. 文本操作:可以操作元素的文本内容。

三、事件jQuery还提供了一系列用于处理事件的方法。

借助事件处理程序,可以在元素上定义事件,比如点击事件、鼠标悬停事件等。

jQuery的帮助文档

jQuery的帮助文档
CSS 操作实例
函数 css(name,value) 为所有匹配元素的给定 CSS 属性设置值: 实例 $(selector).css(name,value) $("p").css("background-color","yellow");
TIY
函数 css({properties}) 同时为所有匹配元素的一系列 CSS 属性设置值:
TIY
slideUp() 实例 $(".flip").click(function(){ $(".panel").slideUp() })
TIY
slideToggle() 实例 $(".flip").click(function(){ $(".panel").slideToggle(); });
jQuery 自定义动画
方法描述ready文档就绪事件当html文档就绪可用时blur触发或将函数绑定到指定元素的blur事件change触发或将函数绑定到指定元素的change事件click触发或将函数绑定到指定元素的click事件dblclick触发或将函数绑定到指定元素的doubleclick事件error触发或将函数绑定到指定元素的error事件focus触发或将函数绑定到指定元素的focus事件keydown触发或将函数绑定到指定元素的keydown事件keypress触发或将函数绑定到指定元素的keypresskeyup触发或将函数绑定到指定元素的keyup事件load触发或将函数绑定到指定元素的load事件mousedown触发或将函数绑定到指定元素的mousedownmouseenter触发或将函数绑定到指定元素的mouseenter事件mouseleave触发或将函数绑定到指定元素的mouseleave事件mousemove触发或将函数绑定到指定元素的mousemovemouseout触发或将函数绑定到指定元素的mouseoutmouseover触发或将函数绑定到指定元素的mouseovermouseup触发或将函数绑定到指定元素的mouseup事件resize触发或将函数绑定到指定元素的resize事件scroll触发或将函数绑定到指定元素的scroll事件select触发或将函数绑定到指定元素的select事件submit触发或将函数绑定到指定元素的submit事件unload触发或将函数绑定到指定元素的unload事件基础jquery实例下面的例子演示了jqueryhide函数隐藏了html文档中所有的元素

jQuery前端开发指南

jQuery前端开发指南

jQuery前端开发指南jQuery是一种广泛应用于前端开发的JavaScript库,它简化了HTML文档的遍历与操作、事件处理、动画效果的实现和AJAX等功能的开发。

本文将从多个方面介绍jQuery的使用,包括选择器、DOM操作、事件处理、动画效果和AJAX等内容。

一、选择器选择器是jQuery的核心特性之一,它通过使用CSS选择器来选取指定的元素进行操作。

首先,我们需要了解基本的选择器类型:1. 元素选择器:通过元素名称选取元素,如$("div")选取所有div元素。

2. ID选择器:通过元素的ID属性选取元素,如$("#myDiv")选取ID为myDiv的元素。

3. 类选择器:通过元素的类名选取元素,如$(".myClass")选取class为myClass的元素。

4. 属性选择器:通过元素的属性选取元素,如$("[name='myName']")选取name属性为myName的元素。

5. 后代选择器:通过指定元素的后代元素选取元素,如$("ul li")选取所有ul下的li元素。

除了以上基本的选择器类型,jQuery还支持伪类选择器、过滤选择器和层级选择器等其他选择器类型,这些选择器的灵活运用可以帮助我们更加高效地选取元素进行操作。

二、DOM操作jQuery提供了丰富的DOM操作方法,可以实现元素的增删改查等功能。

常用的DOM操作方法包括:1. 获取和设置元素的内容:使用.text()方法获取或设置元素的文本内容,使用.html()方法获取或设置元素的HTML内容。

2. 获取和设置元素的属性:使用.attr()方法获取或设置元素的属性值,如.attr("src")获取img元素的src属性值。

3. 添加和删除元素:使用.append()方法在元素内部末尾添加内容,使用.remove()方法删除指定元素。

JQuery方法查询

JQuery方法查询

JQuery方法查询一、核心:$是jquery类的一个别名,$()构造一个jquery对象,jQuery 的核心功能都是通过这个函数实现的。

jQuery中的一切都基于这个函数,或者说都是在以某种方式使用这个函数。

1、 ${表达式}:根据这个表达式来查找所有匹配的元素。

eg:$("div>p"); 查找所有p元素,且这些p元素都是div的子元素.$("input:radio",document.forms[0]); 查找文档第一个表单中,所有的单选按钮。

$("div",xml.responseXML);在一个由ajax返回的xml文档中,查找所有的div元素。

2、$(html标记字符串) :根据提供的html字符串,创建jquery对象包装的dom元素。

eg: $("<div><p>Hello</p></div>").appendTo("body");创建一个 <input> 元素必须同时设定 type 属性$("<input type='text'>")、$(dom元素):将一个或多个dom元素转换为jquery对象。

eg: $(document.body).css( "background", "black" ); 设置页面背景色4、$(document).ready(function(){})==$(function(){});在页面加载完成后自动执行的代码。

二、jquery对象访问。

eq返回的是jquery对象,只能使用jquery方法,get返回的是dom元素对象,只能使用dom方法.1、$(dom元素).each(function(){}):以每一个匹配的元素作为上下文来执行一个函数2、$(dom元素).size()==$(dom元素).length;对象中元素的个数。

jQuery使用手册(一)

jQuery使用手册(一)

jQuery使⽤⼿册(⼀)说明:该函数可以通过css选择器,Xpath或html代码来匹配⽬标元素,所有的jQuery操作都以此为基础参数:expr:字符串,⼀个查询表达式或⼀段html字符串未执⾏jQuery前:<p>one</p><div> <p>two</p></div> <p>three</p> <a href="#" id="test" onClick="jq()" >jQuery</a>jQuery代码及功能:function jq(){ alert($("div > p").html()); }运⾏:当点击id为test的元素时,弹出对话框⽂字为two,即div标签下p元素的内容function jq(){ $("<div><p>Hello</p></div>").appendTo("body");}运⾏:当点击id为test的元素时,向body中添加“<div><p>Hello</p></div>”说明:限制jQuery作⽤于⼀个特定的dom元素,这个函数也接受xml⽂档和windows对象参数: elem:通过jQuery对象压缩的DOM元素例⼦:未执⾏jQuery前:<p>one</p> <div> <p>two</p> </div><p>three</p><a href="#" id="test" onClick="jq()">jQuery</a>jQuery代码及功能:function jq(){ alert($(document).find("div > p").html());}运⾏:当点击id为test的元素时,弹出对话框⽂字为two,即div标签下p元素的内容function jq(){ $(document.body).background("black");}运⾏:当点击id为test的元素时,背景⾊变成⿊⾊说明:限制jQuery作⽤于⼀组特定的DOM元素参数: elem:⼀组通过jQuery对象压缩的DOM元素例⼦:未执⾏jQuery前:<form id="form1"> <input type="text" name="textfield"> <input type="submit" name="Submit" value="提交"></form><a href="#" id="test" onClick="jq()">jQuery</a>jQuery代码及功能:function jq(){ $(form1.elements ).hide(); }运⾏:当点击id为test的元素时,隐藏form1表单中的所有元素。

  1. 1、下载文档前请自行甄别文档内容的完整性,平台不提供额外的编辑、内容补充、找答案等附加服务。
  2. 2、"仅部分预览"的文档,不可在线预览部分如存在完整性等问题,可反馈申请退款(可完整预览的文档不适用该条件!)。
  3. 3、如文档侵犯您的权益,请联系客服反馈,我们会尽快为您处理(人工客服工作时间:9:00-18:30)。

13-11-8jQuery Cheatsheet
/jquery /1/1
Selectors
Basics
*.class element #id
selector1, selectorN, ...
Hierarchy
parent > child
ancestor descendant prev + next prev ~ siblings
Basic Filters
:animated :eq():even :first :gt():header :lang():last :lt():not():odd :root :target
Content Filters
:contains():empty :has():parent
Visibility Filters
:hidden :visible
Attribute
[name|="value"][name*="value"][name~="value"][name$="value"][name="value"][name!="value"[name^="value"][name]
[name="value"][name2="value2"]
Child Filters
:first-child :first-of-type :last-child :last-of-type :nth-child():nth-last-child():nth-last-of-type():nth-of-type():only-child :only-of-type()
Forms
:button :checkbox :checked :disabled :enabled :focus :file :image :input
:password :radio :reset :selected :submit :text
Attributes / CSS
Attributes
.attr().prop()
.removeAttr().removeProp().val()
CSS
.addClass().css()
jQuery.cssHooks .hasClass().removeClass().toggleClass()
Dimensions
.height()
.innerHeight().innerWidth().outerHeight().outerWidth().width()
Offset
.offset()
.offsetParent().position().scrollLeft().scrollTop()
Data
jQuery.data().data()
jQuery.hasData()jQuery.removeData().removeData()
Manipulation
Copying
.clone()
DOM Insertion, Around
.wrap().wrapAll().wrapInner()
DOM Insertion, Inside
.append().appendTo().html().prepend().prependTo().text()
DOM Insertion, Outside
.after().before().insertAfter().insertBefore()
DOM Removal
.detach().empty().remove().unwrap()
DOM Replacement
.replaceAll().replaceWith()
Traversing
Filtering
.eq().filter().first().has().is().last().map().not().slice()
Miscellaneous Traversing
.add().andSelf().contents().each().end()
Tree Traversal
.addBack().children().closest().find().next().nextAll().nextUntil().parent().parents()
.parentsUntil().prev().prevAll().prevUntil().siblings()
Events
Browser Events
.error().resize().scroll()
Document Loading
.holdReady().load().ready().unload()
Event Handler Attachment
.bind().delegate().die().live().off().on().one().trigger()
.triggerHandler().unbind().undelegate()
Form Events
.blur().change().focus().select().submit()
Keyboard Events
.keydown().keypress().keyup()
Mouse Events
.click().dblclick().focusin().focusout().hover()
.mousedown().mouseenter().mouseleave().mousemove().mouseout().mouseover().mouseup().toggle()
Event Object
event.currentTarget event.data
event.isDefaultPrevented()
event.isImmediatePropagationStopped()event.isPropagationStopped()space event.pageX event.pageY
event.preventDefault()event.relatedTarget event.result
event.stopImmediatePropagation()event.stopPropagation()event.target
event.timeStamp event.type event.which
jQuery Quick API Reference Version: 1.10
Search...
About...。

相关文档
最新文档