jquery文档(jquery vue react)
各位老铁们好,相信很多人对jquery文档都不是特别的了解,因此呢,今天就来为大家分享下关于jquery文档以及jquery vue react的问题知识,还望可以帮助大家,解决大家的一些困惑,下面一起来看看吧!
jquery文档操作都有哪些函数
jQuery中为我们提供了很多有用的方法和属性,自己总结的一些常用的函数,方法。个人认为在在线排盘开发中会比较常用的,仅供大家学习和参考。
事件处理
ready(fn)
代码:
$(document).ready(function(){
// Your code here...
});
作用:它可以极大地提高web应用程序的响应速度。通过使用这个方法,可以在DOM载入就绪能够读取并操纵时立即调用你所绑定的函数,而99.99%的JavaScript函数都需要在那一刻执行。
bind(type,[data],fn)
代码:
$("p").bind("click", function(){
alert($(this).text());
});
作用:为每一个匹配元素的特定事件(像click)绑定一个事件处理器函数。起到事件监听的作用。
toggle(fn,fn)代码:
$("td").toggle(
function(){
$(this).addClass("selected");
},
function(){
$(this).removeClass("selected");
}
);
作用:每次点击时切换要调用的函数。如果点击了一个匹配的元素,则触发指定的第一个函数,当再次点击同一元素时,则触发指定的第二个函数。挺有趣的一个函数,在动态实现某些功能的时候可能会用到。
(像click(),focus(),keydown()这样的事件这里就不提了,那些都是开发中比较常用到的。)
外观效果
addClass(class)和removeClass(class)
代码:
$(".stripe tr").mouseover(function(){
$(this).addClass("over");}).mouseout(function(){
$(this).removeClass("over");})
});
也可以写成:
$(".stripe tr").mouseover(function(){$(this).addClass("over")});
$(".stripe tr").mouseout(function(){$(this).removeClass("over")});
作用:为指定的元素添加或移除样式,从而实现动态的样式效果,上面的实例中实现鼠标移动双色表格的代码。
css(name,value)
代码:$("p").css("color","red");
作用:很简单,就是在匹配的元素中,设置一个样式属性的值。这个个人感觉和上面的addClass(class)有点类似。
slide(),hide(),fadeIn(), fadeout(), slideUp(),slideDown()
代码:
$("#btnShow").bind("click",function(event){$("#divMsg").show()});
$("#btnHide").bind("click",function(evnet){$("#divMsg").hide()});
作用:jQuery中提供的比较常用的几个动态效果的函数。还可以添加参数:show(speed,[callback])以优雅的动画显示所有匹配的元素,并在显示完成后可选地触发一个回调函数。
animate(params[,duration[,easing[,callback]]])
作用:制作动画效果用到的函数,功能非常的强大,可以连续使用此函数。
查找筛选
map(callback)HTML代码:
Values:
return$(this).val();
}).get().join(","));
结果:
[
John, password, ; ]
作用:将一组元素转换成其他数组(不论是否是元素数组)你可以用这个函数来建立一个列表,不论是值、属性还是CSS样式,或者其他特别形式。这都可以用'$.map()'来方便的建立。
find(expr)
HTML代码:
Hello, how are you?
jQuery代码:
$("p").find("span")
结果:
[ Hello ]
作用:搜索所有与指定表达式匹配的元素。这个函数是找出正在处理的元素的后代元素的好方法。
文档处理
attr(key,value)HTML代码:
jQuery代码:
$("img").attr("src","test.jpg");
作用:取得或设置匹配元素的属性值。通过这个方法可以方便地从第一个匹配元素中获取一个属性的值。如果元素没有相应属性,则返回 undefined。在控制HTML标记上是必备的工具。
html()/html(val)HTML代码:
Hello
jQuery代码:
$("div").html();
结果:
Hello
作用:取得或设置匹配元素的html内容,同类型的方法还有text()和val()。前者是取得所有匹配元素的内容。,后者是获得匹配元素的当前值。三者有相似的地方常用在内容的操作上。
wrap(html)HTML代码:
Test Paragraph.
jQuery代码:
$("p").wrap("
");
结果:
Test Paragraph.
作用:把所有匹配的元素用其他元素的结构化标记包裹起来。
这种包装对于在文档中插入额外的结构化标记最有用,而且它不会破坏原始文档的语义品质。可以灵活的修改我们的DOM。
empty()HTML代码:
Hello, Person
jQuery代码:
$("p").empty();
结果:
作用:删除匹配的元素集合中所有的子节点。
Ajax处理
load(url,[data],[callback])
url(String):待装入 HTML网页网址。
data(Map):(可选)发送至服务器的 key/value数据。
callback(Callback):(可选)载入成功时回调函数。
代码:
$("#feeds").load("feeds.aspx",{limit: 25}, function(){
alert("The last 25 entries in the feed have been loaded");
});
作用:载入远程 HTML文件代码并插入至 DOM中。这也是Jquery操作Ajax最常用最有效的方法。
serialize()HTML代码:
Results:
check1
checked="checked"/> check2
checked="checked"/> radio1
radio2
jQuery代码:
$("#results").append(""+$("form").serialize()+"");
作用:序列化表格内容为字符串。用于 Ajax请求。
工具
jQuery.each(obj,callback)
代码:
$.each( [0,1,2], function(i, n){
alert("Item#"+ i+":"+ n);
});//遍历数组
$.each({ name:"John", lang:"JS"}, function(i, n){
alert("Name:"+ i+", Value:"+ n);//遍历对象
});
作用:通用例遍方法,可用于例遍对象和数组。
jQuery.makeArray(obj)
HTML代码:
First
Second
Third
Fourth
jQuery代码:
var arr= jQuery.makeArray(document.getElementsByTagName("div"));
结果:
Fourth
Third
Second
First
作用:将类数组对象转换为数组对象。使我们可以在数组和对象之间灵活的转换。
jQuery.trim(str)
作用:这个大家应该很熟悉,就是去掉字符串起始和结尾的空格。
小结:在实际的开发中我们可能会发现21世纪开运网用到其他的方法和属性,以上只是个人认为新手初学jQuery时,必须掌握的一些方法。仅供大家学习的参考。
以上内容就是我们为大家提供的jQuery中常用的函数方法,希望可以帮助到大家。
jQuery开发技术详解的目录
第一篇 jQuery预备基础篇
第1章 Web开发的发展与趋势 2
1.1 Web标准 2
1.1.1 XML 3
1.1.2 XHTML 3
1.1.3 CSS 4
1.1.4 DOM 4
1.1.5 ECMAScript 5
1.2传统互联网与Web 2.0 5
1.2.1传统网络Web 1.0 5
1.2.2最近的新宠Web 2.0 6
1.3 jQuery能做什么 11
1.3.1更加丰富的导航菜单 11
1.3.2 Tab内容的切换 13
1.3.3人性化的提示信息 13
1.3.4可定制的用户内容 14
1.3.5动态的图片展示效果 15
1.3.6 AJAX实时局部刷新 16
1.3.7数据的可视化显示 17
1.4 jQuery知识体系及学习建议 17
1.4.1 jQuery知识体系 17
1.4.2学习建议 19
1.5小结 19
第2章 JavaScript基础 20
2.1什么是JavaScript 20
2.2语法规则 21
2.2.1大小写敏感 21
2.2.2空格、换行与可选的分号 23
2.2.3注释 25
2.2.4关键字和保留字 26
2.2.5在页面上插入JavaScript代码 28
2.3变量 29
2.3.1变量的命名 29
2.3.2变量的声明 30
2.3.3变量的使用 32
2.3.4全局变量和局部变量 33
2.4 JavaScript中的数据类型 35
2.4.1字符串类型 36
2.4.2数值类型 37
2.4.3布尔类型 37
2.4.4 undefined类型 38
2.4.5 null类型 40
2.4.6 NaN类型 40
2.5数据类型间转换 41
2.5.1使用toString()转换为字符串 41
2.5.2使用parseInt()转换为整型数 43
2.5.3使用parseFloat()转换为浮点数 45
2.6 JavaScript操作符 47
2.6.1比较操作符 47
2.6.2逻辑操作符 48
2.6.3 JavaScript操作符优先级 49
2.7流程控制 50
2.7.1条件语句 50
2.7.2循环语句 54
2.8数组 56
2.8.1创建一个数组 57
2.8.2使用数组元素 58
2.8.3使用多维数组 58
2.9函数 59
2.9.1函数的定义 59
2.9.2函数的参数及返回值 60
2.10小结 61
第3章文档对象模型(DOM) 62
3.1什么是DOM 62
3.2 DOM的结构和节点 63
3.2.1 DOM的树结构 63
3.2.2 DOM中的节点 65
3.3访问DOM节点 67
3.3.1按id取元素:getElementById() 67
3.3.2按标签名取元素集:getElementsByTagName() 68
3.4操作元素内的文本 70
3.5操作元素内的HTML 72
3.6修改DOM节点 73
3.6.1创建DOM节点 74
3.6.2插入DOM节点 76
3.6.3删除DOM节点 78
3.7小结 80
第4章工欲善其事,必先利其器——开发工具 81
4.1代码编辑工具 81
4.1.1 SciTE 81
4.1.2 Notepad++ 82
4.1.3 Dreamweaver 83
4.2调试工具 84
4.2.1使用Blackbird进行调试 84
4.2.2使用Firebug进行调试 85
4.2.3使用Venkman进行调试 91
4.3其他工具 92
4.3.1 Web Developer Toolbar 92
4.3.2 JavaScript压缩混淆工具 99
4.4小结 100
第二篇 jQuery基础篇
第5章 jQuery快速上手 102
5.1什么是jQuery 102
5.2为什么选择jQuery 102
5.2.1当前流行JavaScript库比较 103
5.2.2 jQuery的优势 106
5.3配置jQuery开发环境 107
5.3.1获取jQuery最新版本 107
5.3.2 jQuery库类型说明 108
5.3.3在页面中引用jQuery库 108
5.3.4 jQuery 1.2.6新特性及主要改变 110
5.3.5 jQuery 1.3.2新特性及主要改变 112
5.4准备HTML和CSS代码 114
5.4.1演示框架目录结构 115
5.4.2 HTML代码 115
5.4.3 CSS代码 117
5.5编写jQuery代码 119
5.6小结 122
第6章使用选择器获得要操作的元素 123
6.1 CSS选择器 123
6.1.1使用CSS选择器 123
6.1.2通配选择器 124
6.1.3标签选择器 124
6.1.4 ID选择器 125
6.1.5类选择器 125
6.1.6后代选择器 126
6.1.7子元素选择器 127
6.1.8相邻兄弟选择器 127
6.1.9属性选择器 128
6.2 jQuery选择器 130
6.2.1基本选择器 130
6.2.2层次选择器 135
6.2.3基本滤镜选择器 139
6.2.4子元素滤镜选择器 151
6.2.5表单滤镜选择器 156
6.2.6属性滤镜选择器 164
6.3小结 167
第7章操作得到的元素 168
7.1操作属性 168
7.1.1读取属性 168
7.1.2修改属性 170
7.1.3删除属性 173
7.2操作样式类 174
7.2.1添加样式类 174
7.2.2去除样式类 176
7.2.3交替样式类 177
7.3操作CSS 178
7.3.1读取CSS样式 178
7.3.2设置CSS样式 180
7.3.3获得元素偏移信息 182
7.3.4获得和设置高度 183
7.3.5获得和设置宽度 185
7.4操作内容 186
7.4.1操作HTML代码 186
7.4.2操作文本 188
7.4.3操作值 190
7.5查找与筛选元素 193
7.5.1过滤元素集 193
7.5.2在元素集中查找 197
7.6链式操作 202
7.6.1使用链式操作 203
7.6.2结束当前操作对象 205
7.6.3添加当前操作对象到先前对象 207
7.7小结 208
第8章使用jQuery进行DOM操作 209
8.1在元素内部插入DOM元素 209
8.2在元素外部插入DOM元素 214
8.3包裹DOM元素 217
8.3.1使用指定的元素标记进行包裹 217
8.3.2使用HTML标记进行包裹 220
8.3.3包裹内部元素 222
8.4替换DOM元素 223
8.5删除DOM元素 225
8.6克隆DOM元素 227
8.7小结 229
第9章 jQuery中的事件处理 230
9.1页面载入完毕响应事件 230
9.1.1 jQuery中的$(document).ready()事件 230
9.1.2 window.onload()事件和$(document).ready()事件的比较 231
9.2绑定与反绑定事件监听器 233
9.2.1绑定事件 233
9.2.2反绑定事件 238
9.2.3一次性的事件绑定 239
9.3事件触发器 241
9.3.1 trigger触发事件 241
9.3.2 triggerHandler触发事件 244
9.4事件的交互处理 245
9.4.1 hover:模仿鼠标悬停 246
9.4.2 toggle:多次单击的循环响应 247
9.5 jQuery内置事件类型 248
9.5.1 jQuery内置事件函数的两种声明方式 249
9.5.2 jQuery内置事件类型分类 250
9.6小结 253
第10章 jQuery中的动画与效果 254
10.1基本效果 254
10.1.1隐藏元素 254
10.1.2显示元素 258
10.1.3交替显示隐藏 259
10.2滑动效果 260
10.2.1向上收缩效果 260
10.2.2向下展开 262
10.2.3交替伸缩样式 262
10.3淡入淡出效果 263
10.3.1淡入效果 263
10.3.2淡出效果 265
10.3.3自定义不透明度 265
10.4自定义动画效果 266
10.4.1自定义动画 266
10.4.2 jQuery动画队列 270
10.5小结 273
第11章 jQuery与AJAX 274
11.1 AJAX的应用 274
11.1.1 AJAX的历史 274
11.1.2 AJAX经典应用 275
11.2 AJAX原理与XMLHttpRequest对象 278
11.2.1 AJAX的原理 279
11.2.2 XMLHttpRequest对象 281
11.3 jQuery中的AJAX 284
11.3.1 load()、get()和post()函数 284
11.3.2 ajax函数 294
11.3.3 getScript及getJSON函数 300
11.4 jQuery中的AJAX服务器端返回方式 304
11.4.1 html方式 305
11.4.2 text方式 307
11.4.3 xml方式 308
11.4.4 script方式 316
11.4.5 json方式 316
11.5 jQuery中的AJAX事件 318
11.5.1 AJAX局部事件 318
11.5.2 AJAX全局事件 320
11.6小结 323
第12章回头重看jQuery——核心及工具 324
12.1核心函数 324
12.1.1核心函数形式 324
12.1.2使用核心函数 326
12.2 jQuery对象访问 329
12.2.1获得长度 329
12.2.2获得其中某个对象 329
12.2.3遍历对象集 332
12.3数据缓存 333
12.3.1隐藏数据 333
12.3.2设置和获取元素的缓存数据 334
12.3.3删除缓存数据 336
12.4 jQuery常用工具类 337
12.4.1浏览器相关 337
12.4.2数组与对象相关 340
12.4.3其他功能性函数 348
12.5 jQuery插件机制 349
12.5.1 jQuery.extend(object) 350
12.5.2 jQuery.fn.extend(object) 351
12.6小结 352
第三篇 jQuery应用篇
第13章 jQuery增强用户体验 354
13.1动态加载显示内容 354
13.1.1设计网站外观及显示 354
13.1.2 jQuery动态加载内容 356
13.2改进:增强用户体验 358
13.2.1高亮当前选中菜单 358
13.2.2加载时提示“正在加载…” 359
13.3动态切换样式 361
13.3.1 jQuery样式切换简单实现 361
13.3.2使用Cookie保存用户选项 363
13.3.3使用jQuery.cookie插件 366
13.4小结 368
第14章 jQuery中使用AJAX跨域操作 369
14.1跨域操作的实现方式 369
14.1.1 Script方式实现跨域操作 369
14.1.2 JSONP方式实现跨域操作 371
14.2跨域操作flickr网站API 374
14.3跨域操作delicious网站API 378
14.4跨域操作Google AJAX Search API 382
14.5小结 388
第15章 jQuery+PHP动态网站实践 389
15.1标签云(Tag Cloud) 389
15.1.1标签云的概念与使用 389
15.1.2标签云显示样式设计 390
15.1.3设计MySQL数据库 394
15.1.4构建PHP代码 395
15.1.5构建jQuery代码 398
15.2类twitter微博客系统 399
15.2.1微博客系统 400
15.2.2设计MySQL数据库 403
15.2.3构建PHP代码及jQuery代码 404
15.2.4功能改进:增加字数统计功能 408
15.3小结 410
第16章 jQuery键盘操作 411
16.1键盘快捷键动态切换页面 411
16.1.1需求与最终效果 411
16.1.2 HTML及CSS代码 412
16.1.3 jQuery代码 416
16.2使用插件进行改进 420
16.2.1存在的问题 420
16.2.2 js-hotkeys插件的使用 421
16.2.3使用js-hotkeys插件改进本章示例 423
16.3软键盘的实现 425
16.3.1软键盘的使用 425
16.3.2准备HTML及CSS代码 425
16.3.3构建jQuery代码 430
16.3.4最终效果 433
16.4小结 435
第17章 jQuery可视化数据显示 436
17.1数据的可视化显示 436
17.2使用flot插件可视化数据显示 438
17.2.1 flot插件介绍 438
17.2.2准备HTML及CSS代码 439
17.2.3构建jQuery代码 442
17.2.4实现折点上的Tooltip显示 448
17.3小结 451
jquery是什么啊
下面我们介绍一些比较常见的Javascript框架,高手跳过,才学JS和ajax的朋友则应该好好了解一下。
jQuery
jquery是一个快速、简洁的JavaScript框架,帮助你简化查询DOM对象,处理事件,制作动画,和处理Ajax交互过程。利用jQuery将改变你编写JavaScript代码的方式。原先用20行代码完成的功能,jQuery用10行就可以轻松搞定。
Dojo
Dojo是一个强大的面向对象JavaScript框架。主要由三大模块组成:Core、Dijit、DojoX。Core提供 Ajax,events,packaging,CSS-based querying,animations,JSON等相关操作API。Dijit是一个可更换皮肤,基于模板的WEB UI控件库。DojoX包括一些创新/新颖的代码和控件:DateGrid,charts,离线应用,跨浏览器矢量绘图等。
YUI(Yahoo! User Interface Library)
Yahoo! User Interface(YUI) Library是一组采用DOM scripting,Dhtml和Ajax等技术开发的Web UI控件和工具。中文说过来就是“Yahoo用户界面库”。
•Yui工具包利用DOM脚本来简化浏览器内的开发(in-browser devolvement),使用DHTML和AJAX的特性开发所有的Web程序。
•YUI控件库为你页面提供一组高交互性性的可视化元素。这些元素完全在客户端创建维护,不需要请求服务器进行页面刷新。
Mootools
MooTools是一个简洁,模块化,面向对象的JavaScript框架。它能够帮助你更快,更简单地编写可扩展和兼容性强的JavaScript代码。 Mootools从Prototype.js中汲取了许多有益的设计理念,语法也和其极其类似。但它提供的功能要比Prototype.js多,整体设计也比Prototype.js要相对完善,功能更强大,比如增加了动画特效、拖放操作等等。
prototype
prototype是一个易于使用、面向对象的JavaScript框架。它封装并简化和扩展一些在Web开发过程中常用到JavaScript方法与Ajax交互处理过程。
script.aculo.us
script.aculo.us是一个易于使用,支持多种浏览器,用于增强Prototype的JavaScript框架。script.aculo.us包含:动画框架(animation framework),拖放(drag and drop), Ajax控件,DOM工具,单元测试等。
ExtJS
ExtJS是一个跨浏览器,用于开发RIA(Rich iInternet Application)应用的JavaScript框架。提供:高性,可定制的Web UI控件库。良好的设计、丰富的文档和可扩展的组件模型。
好了,文章到这里就结束啦,如果本次分享的jquery文档和jquery vue react问题对您有所帮助,还望关注下本站哦!