文档建议反馈控制台
首页
学习
活动
专区
工具
TVP
最新优惠活动
文章/答案/技术大牛
发布
精选内容/技术社群/优惠产品,尽在小程序
立即前往

JQuery 入门学习(二)

比如，css里面，定义一个类的样式的方法：.XXX{}，而在Jquery里选择一个class=XXX的元素的方法：$(".XXX")。    ...说明 Jquery选择器 选择的元素举例 类似的css语法 选择第一个id=xxx的元素 $("#main") #main { } 选择所有class=xxx...的元素 $(".intro") .intro {} 选择所有X元素(X为标签名) $("h1") h1 {} 选择第一个某元素 $...事件是什么概念，和很多编程一样，事件是由用户在执行相应的操作后自动触发的一个过程，我们可以给某事件绑定一个处理函数，当用户触发了这个事件后，就能执行我们绑定的函数。    ...所以整段代码意思就是为document对象的ready事件添加响应函数function(){}，这个函数里面添加我们希望Jquery做的事情。

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

    事件委托和this

    或这样描述： 　　任何事件产生时，如点击一个按钮，将从最顶端的容器开始（一般是html的根节点）。...通俗的讲，事件就是onclick，onmouseover，onmouseout，等就是事件，委托呢，就是让别人来做，这个事件本来是加在某些元素上的，然而你却加到别人身上来做，完成这个事件。...发布/订阅模型从一个元素发送消息后并向上遍历，有时也向下遍历，DOM会通知遍历路径上的所有元素事件发生了。在下面的示例中，JQuery通过trigger方法传递事件。...例如,当设置一个按钮的单击处理程序,this将引用匿名函数内的按钮。 如果函数是一个对象的构造函数，this指向新对象。 如果函数被定义在一个对象上,然后调用对象时,this指向该对象。...保持处理程序上下文的一个小技巧是将其设置到闭包内的一个变量，当在上下文改变的地方调用一个函数时，如setTimeout，你仍然可以通过该变量引用需要的对象。

    80930

    深入理解JS异步编程二(分布式事件)

    https://blog.csdn.net/wkyseo/article/details/51539245 PubSub模式 从原生的js角度，我们要监听某事件的方法就是利用addEventListener...方法，但是当我们的页面趋于复杂，比如要向某个元素添加多个处理事件，那么就要用一个封装函数汇集多个处理函数 link.onclick = function() { clickHandler1.apply...(this, arguments); clickHandler2.apply(this, arguments); }; 在jquery中，jquery.on()方法使用的比较多，在新版的jquery...中，也舍弃了bind（）方法，统一使用on，jQuery 将link 元素的事件发布给了任何想订阅此事件的人。...使用emit 方法触发事件时，可以添加任意多的附加参数。所有参数均传递至所有处理器。 emitter.emit('evacuate', 'Woman and children first!')

    49040

    jQuery之移除元素方法

    jQuery之移除元素方法 一.empty()方法 从DOM中移除集合中匹配元素的所有子节点。...当我们想将元素自身移除时我们用 .remove()，同时也会移除元素内部的一切，包括绑定的事件及与该元素相关的jQuery数据 示例： <div...detach() 方法和.remove()一样, 除了 .detach()保存所有jQuery数据和被移走的元素相关联。...当需要移走一个元素，不久又将该元素插入DOM时，这种方法很有用。 四.html(“”)方法： html() 方法如果未设置参数，则返回被选元素的当前内容。...而detach()和remove()方法可以将其保存在一个变量中 如声明变量p 写成如下形式 var p=$('p').remove(); 当需要从新添加时可以直接添加如下 p.appendTo("

    26820

    前端之jQuery

    匹配所有大于给定索引值的元素 :lt(index)// 匹配所有小于给定索引值的元素 :not(元素选择器)// 移除所有满足not条件的标签 :has(元素选择器)// 选取所有包含一个或多个标签在其内的标签...$("div").filter(".c1") // 从结果集中过滤出有c1样式类的 等价于 $("div.c1") 补充： .first() // 获取匹配的第一个元素 .last() // 获取匹配的最后一个元素...3.6.4阻止后续事件执行 使用场景：当一个标签绑定了多个事件而我们只希望指定的事件被触发时使用。...--为每一个li标签添加c1类--> 注意: jQuery的方法返回一个jQuery对象，遍历jQuery集合中的元素 - 被称为隐式迭代的过程。...当这种情况发生时，它通常不需要显式地循环的 .each()方法： 也就是说，上面的例子没有必要使用each()方法，直接像下面这样写就可以了： $("li").addClass("c1"); // 对所有标签做统一操作

    4.9K21

    jQuery

    其宗旨就是：写得少，做的多。 下载地址：https://jquery.com/ 推荐下载3.X版本。 点击后直接鼠标右键另存页面为…即可，最后将下载下来的文件引入项目中。...jQuery 里面类操作只是对指定类进行操作，不影响原先的类名。...元素操作 遍历元素 jQuery 隐式迭代只能对同一类元素进行相同操作。...$(“ul”).empty(); 结果：清空ul里所有的li；.html(‘’’’);与其类似 ---- jQuery 尺寸、位置操作 jQuery 尺寸 参数为空时是取值，参数不为空是设置宽高；...; }); 注意：事件委派现在大多采用⬆️这种写法： 优势在于当动态创建元素时，可以动态自动为其绑定事件 例如：ol里添加li并动态绑定事件 $("ol").on("click", "li", function

    21.1K50

    看不完的那种！前端170面试题+答案学习整理（良心制作）

    匹配到span元素，因为span是div所有未span的子元素中的第一个。...，如何使用jquery来选择它们 可以使用标签选择器来选择所有的div元素，$("div")会返回一个包含5个div标签的jQuery对象。...当dom完全加载时，jquery允许你执行代码，使用$(document).ready()最大的好处在于它适用于所有浏览器，jQuery有助于解决跨浏览器兼容性问题。...类 用addClass()和removeClass()方法动态地改变元素的class 58.使用cdn加载jquery库的主要优势是什么 可以节省服务器带宽 可以更快地下载jquery文件 如果浏览器已经从同一个...设置了readonly属性的input元素依然可以获取焦点，但是设置了disabled属性的input元素没有办法获取焦点 readonly只针对input和textarea有效，而disabled对于所有的表单元素都有效

    11.5K50

    jquery jQuery快速入门

    h1标签的div标签 $("div:has(.c1)")// 找到所有后代中有c1样式类的div标签 $("li:not(.c1)")// 找到所有不包含c1样式类的li标签 $("li:not(:has...$("div").filter(".c1") // 从结果集中过滤出有c1样式类的 等价于 $("div.c1") 补充： .first() // 获取匹配的第一个元素 .last() // 获取匹配的最后一个元素...attr(attrName, attrValue)// 为所有匹配元素设置一个属性值 attr({k1: v1, k2:v2})// 为所有匹配元素设置多个属性值 removeAttr()// 从每一个匹配的元素中删除一个属性...载入就绪可以查询及操纵时绑定一个要执行的函数。...当这种情况发生时，它通常不需要显式地循环的 .each()方法： 也就是说，上面的例子没有必要使用each()方法，直接像下面这样写就可以了： $("li").addClass("c1"); // 对所有标签做统一操作

    16.2K50

    jQuery Cheat—Sheet（jQuery学习笔记）

    在页面中选取所有元素: $("p") id选择器 通过 id 选取元素语法如下： $("#test") .class 选择器 jQuery 类选择器可以通过指定的 class 查找元素。...事件处理程序指的是当 HTML 中发生某些事件时所调用的方法。 jQuery 事件方法语法 在 jQuery 中，大多数 DOM 事件都有一个等效的 jQuery 方法。...在下面的实例中，当点击事件在某个 元素上触发时，隐藏当前的元素： $("p").click(function(){ $(this).hide(); }); 双击事件 当双击元素时，会发生...; }); 获得焦点事件 当元素获得焦点时，发生 focus 事件。 当通过鼠标点击选中元素或通过 tab 键定位到元素时，该元素就会获得焦点。...> **默认情况下，所有 HTML 元素都有一个静态位置，且无法移动。

    16.2K30

    一个小时学会jQuery

    选择器 描述 返回 示例 #id 根据给定的id匹配一个元素 单个元素 $("#test")选取id为test的元素 .class 根据给定的类名匹配元素 集合元素 $(".test")选取所有class...在网页当中，使用class属性引用样式表中的类样式，因为类样式的可重用，所以多个元素可以引用同一个样式。...在jQuery中，可以获取同一类名的多个HTML元素，编写方式同CSS，即在类名的前面加上点号。...语法：$(".className") 本例通过类名来获取元素，因为使用同一个类样式的元素可能有多个，所以通过类名来获取元素返回的将是一个数组对象，即jQuery中的包装集，然后对此包装集中的元素进行相关操作...$(window).keydown() //当键盘或按钮被按下时触发事件 $(window).keypress() //当键盘或按钮被按下时触发事件,每输入一个字符都触发一次 $("input").keyup

    18.5K71

    初识jQuery 基础篇

    向被选元素添加一个或多个类样式 　　　　B. 可以是一个，也可以是多个 　2. $(this) 　　　　A. 是一个jQuery对象 　　　　B. 指向鼠标指针当前移向的一菜单级 　　　　C. ...$(selector).children（） 　　　　A. jQuery中遍历后代的一种方法 　　　　B. 用作查找元素的所有直接子元素 5. ...$(selector).hide() 　　　　隐藏元素 论css()方法与addClass方法的区别： 　　A. css()方法为所匹配的元素设置给定的css样式 　　B. addClass()方法向所匹配的元素添加一个或多个类...$==jQuery 　　　　C. 无论页面元素的选择器，还是功能函数的前缀，都必须使用改符号 　2. 链式操作 　　　　A. 在对DOM元素进行多个操作时。...每个HTML页面都有一个DOM，每个DOM都可以表示一棵树 简要图： ? 论DOM拿文本值： 1. inner HTML：拿到的是标签与文本值 2. inner Text：拿到的是金文本值 3.

    1.5K60

    angularJS之站在jQuery的肩膀上

    它其实是一个类工厂，负责将指定的DOM对象转化为jquery对象。 在DOM文档就绪后，启动一个定时器 使用$(document).ready()可以监听DOM文档就绪事件，通常简写成$(...)。...AngularJS引入了三个主要的概念，期望让前端开发更系统化一些： 声明式界面开发 双向数据绑定 使用依赖注入解耦 很多人在初次接触AngularJS时，都有些吃惊，因为它把前端开发搞的突然严肃起来...所以，AngularJS难学一些，因为它有一个架子在那，你不了解这个架子， 基本没法下手。 jqLite：向jQuery致敬 在DOM操作方面，没有人比jQuery做的更好。...在AngularJS的所有API中的element对象，都不是纯粹的DOM对象，而是经过jqLite 封装过的。 选择符的问题 从开发者的角度，jqLite最明显的精简是不支持选择符。...扩展的事件 jqLite还提供一个$destroy事件，当DOM对象被从DOM树删除时，AngularJS将触发 这个事件，以便指令进行一些善后清理工作。

    88710

    25个常规方法优化你的jquery代码

    它节省了你服务器上的带宽，能够很快的从Google的内容分布网络(CDN)上加载JS类库。更重要的是，如果用户访问那些发布在Google Code上的站点后它会被缓存下来。 这样做很有意义。...处理DOM插入操作时，将需要的内容包装在一个元素中 嗯，不要问我为什么要这样做（我相信一个有相当经验的程序员会给你解释）。 在上面的例子中我们使用.html()将1000个item项插入到UL中。...当执行选择操作时，jQuery函数可以指定第二个参数：jQuery( expression, context )通过给选择器提供一个上下文，那就会在这个context中进行元素查找，而不必在整个DOM文档中查找元素...它创建一个有1000项内容的UL，每项都有一个单独的class。 然后遍历之每次选择一项。你应该记得通过class选择所有的1000项item需要耗时5秒多。...当使用事件代理时，你能够在事件被DOM绑定后仍然可以添加多个被匹配的元素到其中，而它们同样能够正常工作。 13. 利用classes存储状态 这是在html中存储信息最基本的方法。

    1.6K10

    是不是直接写“发红包”而不是“请求微信发红包”

    业务序列图时，箭头表示A请求B, 分析序列图是否也有这个意思？ UMLChina潘加宇 道理“A请求B做某事”是一样的，你自己理一理。...类似于 老板 请求（命令） 会计 请求税务局办理手续，会计的责任只是去“请求税务局办理手续” 序列图消息上的很多“请求”是多余的废话，那是因为对应的“做某事”很多时候不是“请求****”。...上面讲了，“A请求B做某事”这个道理是一样的，但这个“做某事”之所以是“请求****”，确实和分析序列图有关，因为我们把系统分解了，其中有一个边界类，专门负责封装“请求微信发红包”的责任。...目标系统里面怎么分解的，是不是分了几个类，到底有没有一个类专门负责“请求A系统做某事”，这就不知道了。...当然，如果目标系统的价值确实就是给A系统当一层外皮，那么指向它的消息写“请求A系统做某事”就是合适的。

    40510
    点击加载更多

    扫码

    添加站长 进交流群

    领取专属 10元无门槛券

    手把手带您无忧上云

    扫码加入开发者社群

    相关资讯

    热门标签

    更多标签

    活动推荐

      运营活动

      活动名称
      广告关闭

      腾讯云开发者

      扫码关注腾讯云开发者

      扫码关注腾讯云开发者

      领取腾讯云代金券

      热门产品

      热门推荐

      更多推荐

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

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

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

      领券