首页
学习
活动
专区
圈层
工具
发布

js与jQuery的区别以及jQuery选择器和方法的使用

目录 使用jQuery js与jQuery代码对比 jQuery选择器:用来选中元素 基本方法 ---- js与jQuery代码对比 jQuery选择器:用来选中元素 基本方法 使用jQuery jQuery...3.3.1 建议下载开发版本 2、HBuilder使用 创建项目 3、把jQuery库复制到项目中的js文件夹中 4、引入jQuery库文件: 注意:script标签中不要写内容,写jQuery代码就再写一对...script标签 js与jQuery代码对比 案例1:点击按钮获取文本框中的值(JS对比jQuery),如下图 JS版: jQuery版: 先引入jQuery库 jQuery选择器:用来选中元素         ...选择器还可以组合多个一起使用,可以分为并集和交集。...并集:selector1,selector2,用逗号隔开 交集:selector1 selector2 用空格隔开 下面我们用代码分别实现一下不同选择器实现效果的方式: 案例2:使用基本选择器改变元素背景色和字体颜色

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

    Jquery选择器与样式操作

    jquery选择器 jquery用法思想一 选择某个网页元素,然后对它进行某种操作 jquery选择器 jquery选择器可以快速地选择元素,选择规则和css样式相同,使用length属性判断是否选择成功...div的所有子元素 $('div').siblings(); //选择div的同级元素 $('div').find('.myClass'); //选择div内的class等于myClass的元素 判断是否选择到了元素...jquery有容错机制,即使没有找到元素,也不会出错,可以用length属性来判断是否找到了元素,length等于0,就是没选择到元素,length大于0,就是选择到了元素。...这是一个div jquery样式操作 jquery用法思想二 同一个函数完成取值和赋值 操作行间样式 // 获取div的样式 $("div").css("width...("width","30px"); $("div").css("height","30px"); $("div").css({fontSize:"30px",color:"red"}); 特别注意 选择器获取的多个元素

    97220

    JQuery的简述、使用方法和选择器

    JQ简述1 1、 jQuery出现的背景(Javascript遇到的问题) 选择器功能弱 DOM操作繁琐之极 浏览器兼容性不好 动画效果弱 2、什么是 jQuery(概念) jQuery...除非特殊要求,一般不会使用 3.x 版本的,很多老的 jQuery 插件不支持这个版本。目前该版本是官方主要更新维护的版本。 注:推荐学习时使用1.x版本,功能更加完善,所学习到的东西更多。...jQuery具有强大的选择器功能 ?...使用前的准备 ? JQ中常用的选择器 一、基本选择器 1、id选择器 通过元素id获取相关元素 ? 2、元素选择器 获得body内的相关元素,如div、input等 ?...使用时直接将相关jquery文件放入JS目录下,在html代码中引入即可。

    1.9K10

    jquery要怎么写才能速度最快?(转…

    (4)$('#parent > .child') jQuery内部使用Sizzle引擎,处理各种选择器。...不要过度使用jquery jQuery速度再快,也无法与原生的javascript方法相比。所以有原生方法可以使用的场合,尽量避免使用jQuery。...所以,使用选择器的次数应该越少越好,并且尽可能缓存选中的结果,便于以后反复使用。...比如,有一个表格(table元素),里面有100个格子(td元素),现在要求在每个格子上面绑定一个点击事件(click),请问是否需要将下面的命令执行100次?   ...尽量少生成jquery对象 每当你使用一次选择器(比如$('#id')),就会生成一个jQuery对象。jQuery对象是一个很庞大的对象,带有很多属性和方法,会占用不少资源。

    2.1K30

    jQuery最佳实践

    (4) $('#parent > .child') jQuery内部使用Sizzle引擎,处理各种选择器。...不要过度使用jQuery jQuery速度再快,也无法与原生的javascript方法相比。所以有原生方法可以使用的场合,尽量避免使用jQuery。...所以,使用选择器的次数应该越少越好,并且尽可能缓存选中的结果,便于以后反复使用。...比如,有一个表格(table元素),里面有100个格子(td元素),现在要求在每个格子上面绑定一个点击事件(click),请问是否需要将下面的命令执行100次?...尽量少生成jQuery对象 每当你使用一次选择器(比如$('#id')),就会生成一个jQuery对象。jQuery对象是一个很庞大的对象,带有很多属性和方法,会占用不少资源。

    1.7K20

    Protocol与Delegate 使用方法详解你要知道的KVC、KVO、Delegate、Notification都在这里

    KVC、KVO、Delegate、Notification的使用方法,来探讨KVO、Delegate、Notification的区别以及相关使用场景,本系列文章将分一下几篇文章进行讲解,读者可按需查阅。...KVC 使用方法详解及底层实现 KVO 正确使用姿势进阶及底层实现 Protocol与Delegate 使用方法详解 NSNotificationCenter 通知使用方法详解 KVO、Delegate...、Notification 区别及相关使用场景 Protocol与Delegate 使用方法详解 protocol协议类似于Java的接口,规定一系列实现类应该遵守的方法,OC中protocol协议远没有...category类别并不要求扩展类的子类实现类别中声明的所有方法,因此,如果Bird类没有实现fly方法再调用fly方法时会抛出异常,因此,正确的使用方法应该先判断其是否能够响应相关方法: int main...是否能响应passValueWithString:方法 如果delegate为nil或不能响应该方法这里的返回值都为false 定义协议需要继承NSObject协议才可使用该方法

    1.3K90

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

    该事件大多数时候会与mouseenter 事件一起使用。与 mouseout 事件不同,只有在鼠标指针离开被选元素时,才会触发 mouseleave 事件。...这个方法的行为表现与trigger类似,但有以下三个主要区别: 第一,他不会触发浏览器默认事件。 第二,只触发jQuery对象集合中第一个元素的事件处理函数。...使用 .bind() 时,选择器匹配的元素会附加一个事件处理函数,而以后再添加的元素则不会有。为此需要再使用一次 .bind() 才行。 参数: type:一个或多个事件类型,由空格分隔多个事件。...使用 delegate() 方法的事件处理程序适用于当前或未来的元素(比如由脚本创建的新元素)在选择元素上绑定一个或多个事件的事件处理函数。...选择器字符串必须是完全匹配递到.on()事件处理程序附加的选择器。要删除非委托元素上的所有事件,使用特殊值 "**" 。 处理程序也可以删除handler参数指定名称的函数。

    3.7K80

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

    该事件大多数时候会与mouseenter 事件一起使用。与 mouseout 事件不同,只有在鼠标指针离开被选元素时,才会触发 mouseleave 事件。...注释:如果在文档元素上进行设置,则无论元素是否获得焦点,该事件都会发生。...使用 .bind() 时,选择器匹配的元素会附加一个事件处理函数,而以后再添加的元素则不会有。为此需要再使用一次 .bind() 才行。 参数: type:一个或多个事件类型,由空格分隔多个事件。...使用 delegate() 方法的事件处理程序适用于当前或未来的元素(比如由脚本创建的新元素)在选择元素上绑定一个或多个事件的事件处理函数。...选择器字符串必须是完全匹配递到.on()事件处理程序附加的选择器。要删除非委托元素上的所有事件,使用特殊值 "**" 。 处理程序也可以删除handler参数指定名称的函数。

    7.6K00
    领券