文档建议反馈控制台
首页
学习
活动
专区
圈层
工具
MCP广场
文章/答案/技术大牛
发布

【领会要领】web前端-轻量级框架应用（jQuery基础）

file 作者 | Jeskson 来源 | 达达前端小酒馆 jquery的安装和语法，jquery的多种选择器，dom操作和jquery事件。...就是说它非常请求，大小在30kb左右；具有强大的选择器和dom操作的封装，可靠的事件处理机制，有完善的ajax，jquery将所有的ajax操作封装到函数``$.ajax()`中；具有丰富的插件，完善的文档...，hover 键盘事件： keypress，keydown，keyup 表单事件： submit，change，focus 窗口事件: scroll，resize 事件绑定 事件绑定语法bind(...(),keyup(),keypress() type参数是含有一个或多个事件类型的字符串，data参数是作为event.data属性值传递给事件对象的额外数据对象，fn参数为绑定到每个匹配元素事件上面的处理函数...()键盘或按钮被按下时，发生keydown事件，keyup当键盘被松开时发生keyup事件。

2.6K20
    • 您找到你想要的搜索结果了吗？
    是的
    没有找到

    JavaScript学习笔记（四）—— jQuery入门

    odd").css("background-color", "#bbbbff"); 子元素伪类选择器 子元素伪类选择器就是选择某一个元素下面的子元素的方式，在jQuery中，子元素伪类选择器分为两大类...选择同元素类型的随后一个子元素 :nth-of-type 选择同元素类型的第n个或奇偶元素,n的值为"整数或odd或even" :only-of-type 匹配父元素中特定类型的唯一子元素(该父元素可以有多个子元素...、keypress、keyup的区别 事件名称 触发方式 返回值 keydown 在键盘上按下某键时触发，一直按一直触发 返回键盘代码 keypress 在键盘上按下一个能产生字符的按键时触发 返回ASCII...码 keyup 松开某一键时触发 返回键盘代码 jQuery的事件处理 1. jQuery常用的事件方法 鼠标操作事件 方法 描述 mousedown() 鼠标的键被按下 mouseenter() 当鼠标指针进入目标时...绑定与接触事件 绑定事件 绑定事件就是将页面中的元素事件类型与其在收到该事件之后期望进行的操作联系到一起。

    11.8K50

    前端开发JS——jQuery常用方法

    注：如果要阻止浏览器的某些默认行为，可以传统的调用事件对象e.preventDefault()来处理；也可以在函数上返回false 12、jQuery键盘事件之keydown与keyup事件 keydown...方法一：$ele.keydown () keydown 无参，只是绑定一个事件，在函数里可以实现其他的绑定事件 方法二：$ele.keydown (handler(eventObject)) keydown...强调按下，keyup强调松开；如果点击按住不放并离开元素，还是会实现所绑定的事件；理论上可以绑定所有元素，一般用于表单元素。...13、jQuery键盘事件之keypress()事件 keydown事件触发在文字还没敲进文本框，这时如果在keydown事件中输出文本框中的文本得到的是触发键盘事件前的文本，而keyup事件触发时整个键盘事件的操作已经完成...如果提供了第二参数，那么事件在往上冒泡的过程中遇到了选择器匹配的元素，将会触发事件回调函数 就是说向上冒泡匹配到的元素，由该元素执行回调函数的范围 16、卸载事件off()方法 通过on()绑定的事件处理程序

    5.7K20

    02-老马jQuery教程-jQuery事件处理

    当按钮被按下时，会发生该事件。它发生在当前获得焦点的元素上。 不过，与 keydown 事件不同，每插入一个字符，就会发生 keypress 事件。...使用 delegate() 方法的事件处理程序适用于当前或未来的元素（比如由脚本创建的新元素）在选择元素上绑定一个或多个事件的事件处理函数。...参数: selector:选择器字符串，用于过滤器触发事件的元素。 type:附加到元素的一个或多个事件。由空格分隔多个事件值。必须是有效的事件。...说明：在选择元素上绑定一个或多个事件的事件处理函数。...要删除特定的委派事件处理程序，提供一个selector 的参数。选择器字符串必须是完全匹配递到.on()事件处理程序附加的选择器。要删除非委托元素上的所有事件，使用特殊值 "**" 。

    3.2K80

    原生 JS DOM 常用操作大全

    事件处理 注册事件 注册事件有三种方法 使用HTML标签属性注册（例如 Vue的事件注册）使用传统的DOM对象注册 (onclick) 具有唯一性 注意:使用这种方式注册 一个事件源只能注册一个...输入框的标签中 当按下字符键的执行顺序 (按下字符键 触发三次事件) keydown > keypress > keyup 其中 keydown 和 keypress 在文件框发生变化之前触发...,然后是keyup事件则是在文件框发生变化之后触发当按下非字符键的执行顺序 (按下非字符, 触发二次事件) keydown > keyup 其中首先触发 keydown , 最后触发 keyup...注意：keydown 和 keypress 在文本框里面特点：先执行事件的处理程序 在将文字落入到文本框中, keyup 在文本框里面的特点：先将文字落入到文本框中在执行事件的处理程序 keydown...(“scroll”,()=>{ console.log(element.scrollTop) }) 表单事件 change事件 当表单的值 发生改变时触发 事件对象 在触发DOM上的某个事件时会产生一个事件对象

    77610

    学习jQuery的基础使用

    jQuery 是一个 JavaScript 库，jQuery 极大地简化了 JavaScript 编程，我们常用jQuery来处理Dom\事件\动画\AJAX jQuery Dom处理 选择器 选择器大家需要深入了解...jQuery 事件 click dbclick mouseenter mouseleave keyup keydown //针对已创建元素 $(".class").on("click",function...（及其子元素） empty() - 从被选元素中删除子元素asdasd 处理class addClass() $("div").addClass("b") - 向被选元素添加一个或多个类...removeClass() - 从被选元素删除一个或多个类 toggleClass() - 对被选元素进行添加/删除类的切换操作 $("div").toggleClass("b") 处理css...ajax是在不刷新页面的情况下，与服务器发生数据交换的技术 $.get(url,function(res){ },"json") $.post(url,data,function(

    1.3K20

    02-老马jQuery教程-jQuery事件处理

    当按钮被按下时，会发生该事件。它发生在当前获得焦点的元素上。 不过，与 keydown 事件不同，每插入一个字符，就会发生 keypress 事件。...构造函数传入选择器，返回的是一个jQuery的包装对象 // 大部分的api都是在jQuery包装对象上 // console.dir($inputArray); $inputArray.focus...使用 delegate() 方法的事件处理程序适用于当前或未来的元素（比如由脚本创建的新元素）在选择元素上绑定一个或多个事件的事件处理函数。...参数: selector:选择器字符串，用于过滤器触发事件的元素。 type:附加到元素的一个或多个事件。由空格分隔多个事件值。必须是有效的事件。...要删除特定的委派事件处理程序，提供一个selector 的参数。选择器字符串必须是完全匹配递到.on()事件处理程序附加的选择器。要删除非委托元素上的所有事件，使用特殊值 "**" 。

    7.1K00

    4-Jquery学习四-事件操作

    ("click")为例，以下是jQuery中事件函数的常规用法(某些函数也存在其它形式的用法，此处暂不列出)： // 这里的选择器selector用于指定可以触发事件的元素 // 这里的选择器ancestor...9,off off()函数用于移除元素上绑定的一个或多个事件的事件处理函数。...12,triggerHandler triggerHandler()函数用于在每个匹配元素上触发指定类型的事件。...事件绑定处理函数(可以绑定多个，触发时按照绑定顺序依次执行)： focusin是支持冒泡的，当我们把鼠标光标放入文本框时，该事件冒泡传递到父元素p上，因此可以在p元素上触发focusin事件。...例如：你一直按住A键，直到10秒钟后才释放，只会在释放按键的时候触发一次keyup事件。 但在这个过程中会触发许多次keydown事件(或keypress事件)。

    5K90

    jQuery源码解析之click()的事件绑定

    一、事件委托 DOM有个事件流特性，所以触发DOM节点的时候，会经历3个阶段： （1）阶段一：Capturing 事件捕获（从祖到目标） 在事件自上（document->html->body->xxx）...() 作用： 在被选元素及子元素上添加一个或多个事件处理程序 源码： //绑定事件的方法 //源码5812行 jQuery.fn.extend( { //在被选元素及子元素上添加一个或多个事件处理程序...().off( event ); //在origFn运行一次的基础上，让origFn调用fn方法，arguments即event return origFn.apply(...( events = elemData.events ) )，在赋值的同时，判断条件 （1）dataPriv //取唯一id //源码4361行 var dataPriv = new Data...(); 在 jQuery 对象中，有唯一id的属性 $("#one") elemData = dataPriv.get( elem ) ① Data() //目标元素的jQuery id

    2.1K20

    JQuery基础

    隐藏所有id=test的元素 $('#test').hide(); 2.文档就绪事件： $(document).ready(function(){ //开始书写jQuery代码 })； 　这是为了防止文档在加载完成前执行...）,keydown（键按下的过程）,keyup（键松开）,事件；ps:keypress不会触发所有的键（如alt,ctrl,esc,shift）,请使用keydown()方法检测 表单事件：submit...（提交表单时）,change（元素值（适用于表单字段）发生改变时）,focus（元素获得焦点）,blur（元素失去焦点）事件； 文档/窗口事件：load（元素已加载触发，在jQuery1.8中废除。...（不带参数） 6.jQuery链(chaining) 链：顾名思义，锁链，即一环套一环。 jQuery中将动作/方法链接在一起，因此，在相同元素上，我们可以在一条语句上运行多个jQuery方法。...，具有相同的父元素） siblings()：返回被选元素的所有同胞（兄弟）元素；可选参数可以用来进行过滤：$('h2').siblings('p')：返回与h2具有相同父元素的p元素 next()：返回被选元素的下一个同胞元素

    5.9K51

    JavaWeb18-jquery学习笔记（Java全栈开发）

    jquery一.筛选 筛选与之前的选择器雷同,筛选提供的都是函数. 1....可以在父元素上检测子元素获取焦点的情况 blur和focusout 失去焦点 事件处理和委派 Jquery对象.事件(fn) on:绑定多个事件 one: 绑定一次事件 one() bind和unbind bind:绑定事件,一直使用,直到解绑 例如:$btn1.bind(“click...不包括浏览器默认的） 委派 live jQuery 给所有匹配的元素附加一个事件处理函数，即使这个元素是以后再添加进来的也有效,例如给A标签添加事件，之后再追加a标签都具有相同的事件。...事件切换 hover 在mouseover和mouseout之间进行切换 toggle 点击事件切换，点击第一次执行 fn，点击第二次执行fn2.....

    7.3K90

    jQuery键盘事件的应用【jQuery框架应用入门13】

    表5-4键盘按键事件 键盘事件 说 明 keydown 当键盘按下时第一个发生的事件，对所有按键有效 keypress 当键盘按下时第二个发生的事件，对中文和特殊按键无效 keyup 当键盘弹起时发生的事件...图5-14键盘按下效果 但是当输在文本框中输入中文时，发现keypress事件并没有被执行，如图5-15所示，只在console窗体中输出了keydown事件和keyup事件。...图5-15按下中文按键测试 在jQuery中，如果你要获取键盘输入的是什么按键，那么可以利用事件参数的which属性即可（event.which）。...现在在keydown和keypress事件中都增加一条代码console.log(event.which)用来在console窗体输出按键的结果，在输出前先保持大小写按键为小写字母模式，然后在文本框中输入小写字母...a，此时在console窗体中的keydown事件中显示的却是大写字母A对应的ascii码值65，而在keypress事件中显示的是正确的小写字母a对应的ascii码97。

    43310

    JQuery最全常用方法指南

    在每个页面中可以 有很多个函数被加载执行，按照fn的顺序来执行。 bind(type, [data], fn) 为每一个匹配元素的特定事件（像click）绑定一个或多个事件处理器函数。...mouseover, mouseout, mouseenter, mouseleave, change, select, submit, keydown, keypress, keyup, error...在每个对 象上，这个事件处理函数只会被执行一次。其他规则与bind()函数相同。 trigger(type, [data]) 在每一个匹配的元素上触发某类事件。...().css(”border”, “2px red solid”); JQuery Selectors 方法说明 基本选择器 $(”#myDiv”) 匹配唯一的具有此id值的元素 $(”div”) 匹配指定名称的所有元素...，我们无需在html元素上直接写事件，而可以直接为通过jquery获取的对象添加事件。

    12.3K31
    点击加载更多

    相关资讯

    热门标签

    更多标签

    活动推荐

      运营活动

      活动名称
      广告关闭

      腾讯云开发者

      扫码关注腾讯云开发者

      扫码关注腾讯云开发者

      领取腾讯云代金券

      热门产品

      热门推荐

      更多推荐

      Copyright © 2013 - 2025 Tencent Cloud. All Rights Reserved. 腾讯云 版权所有

      深圳市腾讯计算机系统有限公司 ICP备案/许可证号：粤B2-20090059 深公网安备号 44030502008569

      腾讯云计算（北京）有限责任公司 京ICP证150476号 | 京ICP备11018762号 | 京公网安备号11010802020287

      领券