Jquery笔记:jQuery是一个JavaScript函数库,专为事件处理设计
1.jQuery的引入 <script text="type/javascript" src=""></script>
html5中<script src=""></script>
2.选择器实例 $(this),$("p"),$("p.intro"),$(".intro"),$("#intro"),
$("ul li:first"),$("[href$='.jpg']"),$("div#intro .head") 3.名称冲突 var jq=jQuery.noConflict();jQuery 使用 $ 符号作为 jQuery 的简写 4.事件 $(document).ready(function) 将函数绑定到文档的就绪事件(当文档完成加载时)
$(selector).click(function) 触发或将函数绑定到被选元素的点击事件
$(selector).dblclick(function) 触发或将函数绑定到被选元素的双击事件
$(selector).focus(function) 触发或将函数绑定到被选元素的获得焦点事件
$(selector).mouseover(function) 触发或将函数绑定到被选元素的鼠标悬停事件 5.隐藏/显示/切换 $(selector).hide(speed,callback);
$(selector).show(speed,callback);
$(selector).toggle(speed,callback);
可选的 speed 参数规定隐藏/显示的速度,可以取以下值:"slow"、"fast" 或毫秒。
可选的 callback 参数是隐藏或显示完成后所执行的函数名称。 6.淡入/淡出/切换/透明度 $(selector).fadeIn(speed,callback);
$(selector).fadeOut(speed,callback);
$(selector).fadeToggle(speed,callback);
$(selector).fadeTo(speed,opacity,callback);
必需的opacity参数将淡入淡出效果设置为给定的不透明度(值介于0-1之间)。 7.向下滑动/向上滑动/切换 slideDown()、slideUp()、slideToggle() 8.动画 $(selector).animate({params},speed,callback);必需的params参数定义形成动画的CSS属性
如需对位置进行操作,要记得首先把元素的 CSS position 属性设置为 relative、fixed 或 absolute! 注意:当使用 animate() 时,必须使用 Camel 标记法书写所有的属性名,比如,
必须使用 paddingLeft 而不是 padding-left,使用 marginRight 而不是 margin-right,等等。
同时,色彩动画并不包含在核心 jQuery 库中。如果需要生成颜色动画,您需要从 jQuery.com 下载 Color Animations 插件。 9.停止动画 $(selector).stop(stopAll,goToEnd);用于停止动画或效果,在它们完成之前。
适用于所有 jQuery 效果函数,包括滑动、淡入淡出和自定义动画。 10.方法链接 例如$("#p1").css("color","red").slideUp(2000).slideDown(2000); 11.获得/设置内容 text()设置或返回所选元素的文本内容
html()设置或返回所选元素的内容(包括HTML标记)
val()设置或返回表单字段的值
attr()方法用于获取属性值,允许同时设置多个属性
$("#w3s").attr({
"href" : "http://www.w3school.com.cn/jquery",
"title" : "W3School jQuery Tutorial"
}); 12.添加内容 var txt3=document.createElement("big"); // 通过 DOM 创建新元素
txt3.innerHTML="jQuery!";
append()在被选元素的结尾插入内容
prepend()在被选元素的开头插入内容
after()在被选元素之后插入内容
before()在被选元素之前插入内容 13.删除内容 remove()删除被选元素(及其子元素)
empty()从被选元素中删除子元素 14.操作css属性 addClass()向被选元素添加一个或多个类
removeClass()从被选元素删除一个或多个类
toggleClass()对被选元素进行添加/删除类的切换操作
css()设置或返回样式属性 15.获得css属性css("propertyname");
设置css属性css("propertyname","value");
设置多个css属性css({"propertyname":"value","propertyname":"value",...}); 16.获得/设置尺寸width()、height()、innerWidth()、innerHeight()、outerWidth()、outerHeight() 17.用于向上遍历 DOM 树:parent()、parents()、parentsUntil()介于两个给定元素之间的所有祖先元素
向下遍历 DOM 树的 jQuery 方法:children()、find()
DOM 树进行水平遍历:siblings()返回被选元素的所有同胞元素、
next()、nextAll()、nextUntil()、
prev()、prevAll()、prevUntil()
first(), last() 和 eq(),它们允许您基于其在一组元素中的位置来选择一个特定的元素
filter() 和 not() 允许您选取匹配或不匹配某项指定标准的元素 -------------------------------------------------------------------------------- Ajax笔记:异步 JavaScript 和 XML(Asynchronous JavaScript and XML) 1.load() 方法从服务器加载数据,并把返回的数据放入被选元素中
$(selector).load(URL,data,callback);
可选的 callback 参数规定当 load() 方法完成后所要允许的回调函数。回调函数可以设置不同的参数:
responseTxt - 包含调用成功时的结果内容
statusTXT - 包含调用的状态
xhr - 包含 XMLHttpRequest 对象 2.$.get() 方法通过 HTTP GET 请求从服务器上请求数据。$.get(URL,callback);
$.post() 方法通过 HTTP POST 请求从服务器上请求数据。$.post(URL,data,callback);
GET 基本上用于从服务器获得(取回)数据。注释:GET 方法可能返回缓存数据。
POST 也可用于从服务器获取数据。不过,POST 方法不会缓存数据,并且常用于连同请求一起发送数据。 3.jQuery 使用 $ 符号作为 jQuery 的简写 4.$(this).hide()隐藏当前的 HTML 元素。
$("p").hide()隐藏所有 <p> 元素。
$(".test").hide()隐藏所有 class="test" 的元素。
$("#test").hide()隐藏 id="test" 的元素。 5.html改变html元素的内容
append向html元素追加内容
before在html元素前面添加文本
after在html元素后面添加文本 css添加、改变、获得html元素的内容 6.使用$.ajax(options)改变html内容
$(document).ready(function(){
$("#b01").click(function(){
htmlobj=$.ajax({url:"/jquery/test1.txt",async:false});
$("#myDiv").html(htmlobj.responseText);
});
});
7.补充:jQuery 是客户端脚本库 --------------------------------------------------------------------------------
Jquery笔记:jQuery是一个JavaScript函数库,专为事件处理设计 1.事件
$(selector).blur();当元素失去焦点时发生 blur 事件
$(selector).focus();当元素获得焦点时,发生 focus 事件
$(selector).load(function);当指定的元素(及子元素)已加载时,会发生 load() 事件
$(document).ready(function);当 ready 事件发生时执行的代码,仅能用于当前文档,因此无需选择器
$(selector).submit();当提交表单时,会发生 submit 事件 2.效果函数
fadeIn() 逐渐改变被选元素的不透明度,从隐藏到可见
fadeOut() 逐渐改变被选元素的不透明度,从可见到隐藏
fadeTo() 把被选元素逐渐改变至给定的不透明度
hide() 隐藏被选的元素
show() 显示被选的元素
slideDown() 通过调整高度来滑动显示被选元素
slideToggle() 对被选元素进行滑动隐藏和滑动显示的切换
slideUp() 通过调整高度来滑动隐藏被选元素
stop() 停止在被选元素上运行动画
toggle() 对被选元素进行隐藏和显示的切换 3.文档操作方法
after() 在匹配的元素之后插入内容。
append() 向匹配元素集合中的每个元素结尾插入由参数指定的内容。
appendTo() 向目标结尾插入匹配元素集合中的每个元素。
attr() 设置或返回匹配元素的属性和值。
before() 在每个匹配的元素之前插入内容。
html() 设置或返回匹配的元素集合中的 HTML 内容
remove() 移除所有匹配的元素。
removeAttr() 从所有匹配的元素中移除指定的属性。
val() 设置或返回匹配元素的值。
text() 设置或返回匹配元素的内容。 4.属性操作方法
5.css操作函数
$(selector).height();方法返回或设置匹配元素的高度。
css() 设置或返回匹配元素的样式属性
width() 设置或返回匹配元素的宽度。 5.Ajax 操作函数
$.ajax({url:"/jquery/test1.txt",async:false});
$.ajax({type: 'POST',url: url,data: data,success: success,dataType: dataType});
jQuery.post(url,data,success(data, textStatus, jqXHR),dataType);
$(selector).get(url,data,success(response,status,xhr),dataType);
load(url,data,function(response,status,xhr)); 6.遍历函数
7.数据操作函数
8.DOM 元素方法

Jquery笔记和ajax笔记的更多相关文章

  1. jQuery学习笔记之Ajax用法详解

    这篇文章主要介绍了jQuery学习笔记之Ajax用法,结合实例形式较为详细的分析总结了jQuery中ajax的相关使用技巧,包括ajax请求.载入.处理.传递等,需要的朋友可以参考下 本文实例讲述了j ...

  2. jQuery:自学笔记(5)——Ajax

    jQuery:自学笔记(5)——Ajax 使用Ajax快捷函数 说明 出于简化AJAX开发工作的流程,jQuery提供了若干了快捷函数. 实例 1.显示 test.php 返回值(HTML 或 XML ...

  3. jQuery学习笔记(Ajax)

    jQuery对Ajax操作进行了封装,在jQuery中$.ajax方法属于最底层的方法,第2层是$.load().$.get().$.post()方法,第3层是$.getScript()和$.getJ ...

  4. 《锋利的JQuery》读书要点笔记5——jQuery与Ajax的应用

    第6章 jQuery与Ajax的应用 Ajax的全称:Asynchronous JavaScript and XML (异步Javascript和XML) 传统模式中,数据提交通过表单方式实现,数据的 ...

  5. jquery中的ajax请求到php(学生笔记)

    首先ajax的基本语法基础.(必须得引入一个jquery文件,下面的例子展示用了网上的jquery文件,要联网.) 2.请求成功(复制代码运行观察效果) <!DOCTYPE html> & ...

  6. jQuery官方基础教程笔记(转载)

    本文转载于阮一峰的博文,内容基础,结构清晰,是jquery入门不可多得的资料,非常好,赞一个. 阮一峰:jQuery官方基础教程笔记 jQuery是目前使用最广泛的javascript函数库. 据统计 ...

  7. 【笔记】AJAX基础

    [笔记]AJAX基础 Django AJAX  知识储备:JSON 什么是 JSON JSON 是轻量级的文本数据交换格式 JSON 独立于语言和平台.JSON 解析器和 JSON 库支持许多不同的编 ...

  8. 【笔记】AJAX+SweetAlert插件实现删除操作

    [笔记]AJAX+SweetAlert插件实现删除操作 Django AJAX SweetAlert  展示 SweetAlert 插件介绍 SweetAlert 是一个 JS 插件,能够完美替代 J ...

  9. 学习笔记:AJAX 跨域问题

    学习笔记:AJAX 跨域问题 AJAX 跨域是浏览器的问题. 只要 xhr 请求,不同的域名就会出现 AJAX 跨域问题. JSONP 是一要简单方式,但是有很多弊端,需要修改服务端代码. JSONP ...

随机推荐

  1. Vue中循环的反人类设计

    今天学习Vue到循环那里,表示真是不能理解Vue的反人类设计 具体看代码吧! <!DOCTYPE html> <html> <head> <meta char ...

  2. 【MySQL 读书笔记】全局锁 | 表锁 | 行锁

    全局锁 全局锁是针对数据库实例的直接加锁,MySQL 提供了一个加全局锁的方法, Flush tables with read lock 可以使用锁将整个表的增删改操作都锁上其中包括 ddl 语句,只 ...

  3. DAY20、垃圾回收机制,正则模块

    一.垃圾回收机制1.不能被程序访问到的数据,就称之为垃圾2.引用计数:每一次对值地址的引用都可以使该值得引用计数加1 每一次对值地址的释放都可以使该值得引用计数减一 当一个值的引用计数为0时,该值就会 ...

  4. Python——汇总

    一.工具类 (1)pycharm激活.中文破解 (2)pycharm的基本设置 (3)pycharm常用包和插件的安装 二.数据类型 (1)列表.元祖.字典 操作方法 (2)迭代器操作方法 (3)生成 ...

  5. QComboBox使用方法,QComboBox详解

    fromComboBox = QComboBox() 添加一个 combobox fromComboBox.addItem(rates) 添加一个下拉选项 fromComboBox.addItems( ...

  6. luogu P1659 [国家集训队]拉拉队排练

    唔....话说好久没有发布题解了(手痒痒了 首先特别鸣谢lykkk大佬今天下午教我Manacher算法,甚是感谢 为了体现学习成果,写一篇蒟蒻版的题解(大佬勿喷 言归正传 题面——>在这儿 首先 ...

  7. 【UOJ453】【集训队作业2018】围绕着我们的圆环 线性基 DP

    题目大意 有一个 \(n\times k\) 的 01矩阵 \(C\),求有多少个 \(n\times m\) 的矩阵 \(A\) 和 \(m\times k\) 的矩阵 \(B\),满足 \(A\t ...

  8. 「LibreOJ β Round #4」框架 [bitset]

    题面 loj #include <cmath> #include <cstring> #include <cstdio> #include <cstdlib& ...

  9. 【BZOJ4000】[TJOI2015]棋盘(矩阵快速幂,动态规划)

    [BZOJ4000][TJOI2015]棋盘(矩阵快速幂,动态规划) 题面 BZOJ 洛谷 题解 发现所有的东西都是从\(0\)开始编号的,所以状压只需要压一行就行了. 然后就可以随意矩乘了. #in ...

  10. CENTOS手动安装修复python ,YUM CENTOS手动安装修复YUM

    CENTOS手动安装修复YUM  2019年3月8日  杨宇 Comments 0 Comment 目录 [hide] 一.问题场景 二.手动修复 2.1 下载 rpm 包 2.2 安装 rpm 包 ...