![](https://img-blog.csdnimg.cn/20201014180756919.png?x-oss-process=image/resize,m_fixed,h_64,w_64)
jQuery
jiaody111
这个作者很懒,什么都没留下…
展开
-
jQuery3.7--input的change和propertychange事件
在表单中通常需要实时监听输入 change事件是在失焦(鼠标点击别处)时触发 propertychange事件能实时监听输入内容的变化(不需失焦) 一般使用事件委派。 ...原创 2019-12-11 09:54:23 · 732 阅读 · 0 评论 -
jQuery练习3--添加和删除记录
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>Title</title> <script type="text/javascript" src="js/jquery-1.10.1.js"></...原创 2019-12-10 15:32:18 · 192 阅读 · 0 评论 -
jQuery练习2--回到顶部
瞬间回到顶部: $('html,body').scrollTop(0) 平缓回到顶部: 第一种方法: 使用自定义动画: $('body,html').animate({scrollTop:0},300) //设置动画时长。让滚动条匀速回到顶部 第二种方法: 设置定时器,定义每一帧滚动条上移的距离 <!DOCTYPE html> <html lang="en"> <...原创 2019-12-09 16:15:05 · 140 阅读 · 0 评论 -
jQuery练习1--爱好选择器
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>Title</title> <style> * { margin: 0; padding...原创 2019-12-09 15:17:26 · 306 阅读 · 0 评论 -
jQuery3.6--事件绑定/解绑/坐标/阻止事件冒泡/阻止事件默认行为
事件绑定和解绑 1. 事件绑定(2种): * eventName(function(){}) 绑定对应事件名的监听, 例如:$('#div').click(function(){}); * on(eventName, funcion(){}) 通用的绑定事件监听, 例如:$('#div').on('click', function(){}) * 优缺点: eve...原创 2019-12-08 21:47:49 · 392 阅读 · 0 评论 -
jQuery3.5--事件委派
事件委托(委派/代理): 将多个子元素(li)的事件监听委托给父辈元素(ul)处理 监听回调是加在了父辈元素上 当操作任何一个子元素(li)时, 事件会冒泡到父辈元素(ul) 父辈元素不会直接处理事件, 而是根据event.target得到发生事件的子元素(li), 通过这个子元素调用事件回调函数 设置事件委托: $(parentSelector).delegate(childrenSelect...原创 2019-12-08 21:39:49 · 347 阅读 · 0 评论 -
jQuery3.4_筛选_查找父/子/兄弟
在已经匹配出的元素集合中根据选择器查找孩子/父母/兄弟标签 children(): 子标签中找 find() : 后代标签中找 parent() : 父标签 prevAll() : 前面所有的兄弟标签 nextAll() : 后面所有的兄弟标签 siblings() : 前后所有的兄弟标签 <!DOCTYPE html> <html lang="en"> <hea...原创 2019-12-08 21:11:51 · 171 阅读 · 0 评论 -
jQuery3.3--筛选_过滤
在jQuery对象中的元素对象数组中过滤出一部分元素来 first() last() eq(index|-index) filter(selector) not(selector) has(selector) <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> ...原创 2019-12-08 20:59:19 · 90 阅读 · 0 评论 -
jQuery3.2--三种尺寸
height和width $.width() 和$.height() 读写的是元素内容的宽高 innerHeight和innerWidth innerHeight(): height+padding innerWidth(): width+padding outerHeight和outerWidth outerHeight(false/true): height+padding+b...原创 2019-12-08 20:02:01 · 106 阅读 · 0 评论 -
jQuery2.6--属性
操作任意属性 attr() 读写任意属性:读取属性时,只读取找到的第一个满足条件的值 设置属性时,给所有满足条件的属性都设置相应的值 removeAttr() 删除任意属性:删除所有满足条件的属性值 要删除多个属性,属性之间用空格隔开 prop() 读写属性值为布尔的属性 操作class属性 addClass() removeClass() toggleClass() hasClass() ...原创 2019-12-08 15:51:32 · 174 阅读 · 0 评论 -
jQuery2.5--表单选择器
表单属性过滤选择器: :enabled 选取可用的表单元素 :checked 选取被选中的表单元素(单选框,多选框) :disabled 选取不可用的表单元素 表单选择器: :input 选取所有<input> <textarea> <select> <button> 元素 :text 选取所有单行文本框 :radio 选取所有单选框 :che...原创 2019-12-08 14:31:52 · 113 阅读 · 0 评论 -
jQuery2.4--过滤选择器
过滤选择器:基本过滤、内容过滤、可见性过滤和属性过滤 基本过滤: :first :last :not :even :odd :eq(index) 选取索引值为index的元素 :gt(index) 选取索引值大于index的元素 :lt(index) 选取索引值小于index的元素 内容过滤: :contains(text) 选取包含文本内容text的元素 :empty 选取不包含子元素或文...原创 2019-12-08 14:07:32 · 224 阅读 · 0 评论 -
jQuery2.3--层次选择器
层次选择器:查找子元素, 后代元素, 兄弟元素的选择器 ancestor descendant :给定的祖先元素下匹配所有的后代元素 parent>child :在给定的父元素下匹配所有的子元素 prev+next :匹配所有紧接在 prev 元素后的 next 元素 prev~siblings :匹配 prev 元素之后的所有 siblings 元素 可以用nexAll() 代替sib...原创 2019-12-08 12:09:09 · 84 阅读 · 0 评论 -
jQuery2.1--each,forEach和map方法
静态方法和实例方法 静态方法直接添加给类,通过类名调用 实例方法添加给类的原型,通过实例(对象)调用 <script> // 1.定义一个类 function AClass() { } // 2.给这个类添加一个静态方法 // 直接添加给类的就是静态方法 AClass.staticM...原创 2019-12-08 11:16:52 · 187 阅读 · 0 评论 -
jQuery1--jQuery对象
jQuery对象: jQuery对象是通过jQuery包装DOM对象后产生的对象: 包含所有匹配的任意多个dom元素的伪数组对象 伪数组: Object对象 length属性 数值下标属性 没有数组特别的方法: forEach(), push(), pop(), splice() 基本行为: size()/length: 包含的DOM元素个数 [index]/get(index): 得到对应...原创 2019-12-08 11:08:06 · 95 阅读 · 0 评论 -
jQuery4--动画
jQuery的任何动画效果,都可以指定三种速度参数:slow normal和fast 时间长度分别为 0.6s 0.4s 和0.2s。 使用速度关键字要加引号 如show(‘fast’) 使用数字做参数不需加引号 如show(1000) 显示,隐藏和切换动画: show()和hide()和toggle() hide()方法能将元素的display属性设置为none,而且在这之前,会记住该元素原来的...原创 2019-08-03 10:44:20 · 164 阅读 · 0 评论 -
jQuery3.5--节点增删改和复制
创建和插入节点 <!DOCTYPE html> <html> <head> <meta charset="utf-8"> <title></title> <script src='../jQuery/jquery-1.12.4.js'></script> <script> ...原创 2019-08-03 20:05:18 · 219 阅读 · 0 评论 -
jQuery2--入口函数和核心方法
Jquery = JS + Query (查询)是JS的一个轻量级的库 引入jQuery: <script src='../jQuery/jquery-1.12.4.js'></script> jQuery的固定写法: $ 等价于 jQuery <script> $(document).ready(function(){ console.lo...原创 2019-07-22 23:37:20 · 155 阅读 · 0 评论 -
jQuery3.1--CSS读写/offset/position/scroll
获取和设置css样式 获取:只需传递一个参数 设置:以键值对的形式传递要设置的属性和属性值 <script src='../jQuery/jquery-1.12.4.js'></script> <script> $(function() { $(function() { //1.逐个设置css样式 $('div').cs...原创 2019-08-01 18:43:47 · 154 阅读 · 0 评论 -
jQuery2.2--基本选择器
内容选择器 <script> $(function() { //:empty 不包含文本或者子元素的空元素 var $div1 = $("div:empty") console.log($div1) //:parent 包含文本或者子元素的非空元素 var $div2 = $("div:parent") console.log(...原创 2019-07-23 20:21:08 · 136 阅读 · 0 评论