jQuery学习基础知识小结


Posted in Javascript onNovember 25, 2010

jQuery学习笔记:

jQuery学习
1、基本语法:
$(selector).action()
$:定义jQuery
selector:选择符,查询和查找HTML元素
action():对元素执行的操作
实例:
$(this).hide()------隐藏当前元素
$("p"),hide()-------隐藏所有的p元素
$("#ID").hide()-----隐藏id=ID的元素
$("p.Class")--------隐藏class=Class的P

$(document).ready(function(){-----});
这样用为了防止文档未加载就运行jQuery代码。
2、选择器通过属性选择元素
$("[href]") 选择所有具有href属性的元素
$("[href='AA']") 选择属性href=‘AA'的元素
$("[href!='AA']")选择所有href!=‘AA'的元素
$("[href$='.jpg']")选取所有href值以.jpg结尾的元素
3、选择器选择Css属性
$("p").css("background-color","red"); 修改所有的p元素的背景颜色为红色
$("div#ID .Class") id=ID的div元素中所有class=Class的元素
4、名称冲突
var jQMy = jQuery.noConflict() yong jQMy代替$
5、常用事件
$(document).ready(function) 文档的就绪事件
$(selector).click(function) 被选元素的点击事件
$(selector).dblclick(function) 被选元素的双击事件
$(selector).focus(function) 被选元素获得焦点事件
$(selector).mouseover(function) 被选元素鼠标悬停事件
6、jQuery效果
$(selector).hide() 隐藏被选元素
$(selector).show() 显示被选元素
$(selector).toggle() 切换(在隐藏与显示之间)被选元素
$(selector).slideDown() 向下滑动(显示)被选元素
$(selector).slideUp() 向上滑动(隐藏)被选元素
$(selector).slideToggle() 对被选元素切换向上滑动和向下滑动
$(selector).fadeIn() 淡入被选元素
$(selector).fadeOut() 淡出被选元素
$(selector).fadeTo() 把被选元素淡出为给定的不透明度
$(selector).animate() 对被选元素执行自定义动画
参数:"slow", "fast", "normal" 或毫秒
回调函数:callback
$("p").hide(1000,function(){
alert("The paragraph is now hidden");
});
7、jQuery的HTML操作
$(selector).html(content) 改变被选元素的(内部)HTML
$(selector).append(content) 向被选元素的(内部)HTML 追加内容
$(selector).prepend(content) 向被选元素的(内部)HTML “预置”(Prepend)内容
$(selector).after(content) 在被选元素之后添加 HTML
$(selector).before(content) 在被选元素之前添加 HTML
8、jQuery的CSS操作
$(selector).css(name,value) 为匹配元素设置样式属性的值
$(selector).css({properties}) 为匹配元素设置多个样式属性
$(selector).css(name) 获得第一个匹配元素的样式属性值
$(selector).height(value) 设置匹配元素的高度
$(selector).width(value) 设置匹配元素的宽度
9、jQuery AJAX 请求
$(selector).load(url,data,callback) 把远程数据加载到被选的元素中
$.ajax(options) 把远程数据加载到 XMLHttpRequest 对象中
$.get(url,data,callback,type) 使用 HTTP GET 来加载远程数据
$.post(url,data,callback,type) 使用 HTTP POST 来加载远程数据
$.getJSON(url,data,callback) 使用 HTTP GET 来加载远程 JSON 数据
$.getScript(url,callback) 加载并执行远程的 JavaScript 文件
(selector) jQuery 元素选择器语法
(url) 被加载的数据的 URL(地址)
(data) 发送到服务器的数据的键/值对象
(callback) 当数据被加载时,所执行的函数
(type) 被返回的数据的类型 (html,xml,json,jasonp,script,text)
(options) 完整 AJAX 请求的所有键/值对选项

Javascript 相关文章推荐
JavaScript设置FieldSet展开与收缩
May 15 Javascript
PNG背景在不同浏览器下的应用
Jun 22 Javascript
基于jsTree的无限级树JSON数据的转换代码
Jul 27 Javascript
Jquery插件 easyUI属性汇总
Jan 19 Javascript
浏览器的JavaScript引擎的识别方法
Oct 20 Javascript
javascript显示中文日期的方法
Jun 18 Javascript
使用coffeescript编写node.js项目的方法汇总
Aug 05 Javascript
jQuery实现可以控制图片旋转角度效果(附demo源码下载)
Jan 27 Javascript
jquery实现拖动效果
Aug 10 Javascript
javascript中mouseenter与mouseover的异同
Jun 06 Javascript
vue跨域解决方法
Oct 15 Javascript
vue.js 底部导航栏 一级路由显示 子路由不显示的解决方法
Mar 09 Javascript
javascript预览上传图片发现的问题的解决方法
Nov 25 #Javascript
juqery 学习之三 选择器 子元素与表单
Nov 25 #Javascript
juqery 学习之三 选择器 可见性 元素属性
Nov 25 #Javascript
juqery 学习之三 选择器 简单 内容
Nov 25 #Javascript
juqery 学习之三 选择器 层级 基本
Nov 25 #Javascript
jquery 学习之二 属性 文本与值(text,val)
Nov 25 #Javascript
jquery 学习之二 属性(html()与html(val))
Nov 25 #Javascript
You might like
Smarty Foreach 使用说明
2010/03/23 PHP
PHP大批量插入数据库的3种方法和速度对比
2014/07/08 PHP
php操作csv文件代码实例汇总
2014/09/22 PHP
Centos下升级php5.2到php5.4全记录(编译安装)
2015/04/03 PHP
Yii输入正确验证码却验证失败的解决方法
2017/06/06 PHP
Laravel timestamps 设置为unix时间戳的方法
2019/10/11 PHP
javascript demo 基本技巧
2009/12/18 Javascript
Jquery 点击按钮自动高亮实现原理及代码
2014/04/25 Javascript
关于JavaScript中name的意义冲突示例介绍
2014/05/29 Javascript
jquery中页面Ajax方法$.load的功能使用介绍
2014/10/20 Javascript
深入理解JavaScript系列(38):设计模式之职责链模式详解
2015/03/04 Javascript
在Mac OS下使用Node.js的简单教程
2015/06/24 Javascript
分步解析JavaScript实现tab选项卡自动切换功能
2016/01/25 Javascript
第七篇Bootstrap表单布局实例代码详解(三种表单布局)
2016/06/21 Javascript
基于JavaScript实现树形下拉框
2016/08/10 Javascript
JavaScript实现无刷新上传预览图片功能
2017/08/02 Javascript
详解vue-cli脚手架build目录中的dev-server.js配置文件
2017/11/24 Javascript
[01:48]DOTA2 2015国际邀请赛中国区预选赛第二日战报
2015/05/27 DOTA
[00:32]2016完美“圣”典风云人物:Maybe宣传片
2016/12/05 DOTA
[56:41]iG vs Winstrike 2018国际邀请赛小组赛BO2 第二场
2018/08/17 DOTA
详解python并发获取snmp信息及性能测试
2017/03/27 Python
浅谈Python实现2种文件复制的方法
2018/01/19 Python
vue.js实现输入框输入值内容实时响应变化示例
2018/07/07 Python
解决使用PyCharm时无法启动控制台的问题
2019/01/19 Python
python3字符串操作总结
2019/07/24 Python
使用批处理脚本自动生成并上传NuGet包(操作方法)
2019/11/19 Python
Club Monaco加拿大官网:设计师男女服装
2019/09/29 全球购物
药学专业个人的自我评价
2013/12/31 职场文书
优秀教师事迹简介
2014/02/02 职场文书
个人查摆剖析材料
2014/02/04 职场文书
计算机应用应届生求职信
2014/07/12 职场文书
银行自荐信范文
2015/03/25 职场文书
2015年结对帮扶工作总结
2015/05/04 职场文书
2016清明节森林防火广播稿
2015/12/17 职场文书
详解Python 3.10 中的新功能和变化
2021/04/28 Python
实例详解Python的进程,线程和协程
2022/03/13 Python