首页
学习
活动
专区
工具
TVP
发布
精选内容/技术社群/优惠产品,尽在小程序
立即前往

4-Jquery学习四-事件操作

同样以初始HTML代码为例,我们可以编写如下jQuery代码: bind()函数的参数eventsMap是一个对象,可以"属性-值"的方式指定多个"事件类型-处理函数"。...jQuery 1.3 新增该函数,从jQuery 1.7开始被标记为已过时,在jQuery 1.9中被移除,请使用on()函数来替代。请使用on()函数来替代。 5,die 同上。...; } } ); delegate()函数的参数eventsMap是一个对象,可以"属性-值"的方式指定多个"事件类型-处理函数"。...'); on()函数的参数eventsMap是一个对象,可以"属性-值"的方式指定多个"事件类型-处理函数"。...; }); 此外,我们还可以同时绑定多个事件,并为事件处理函数传递一些附加的数据,我们可以通过jQuery为事件处理函数传入的参数event(Event事件对象)来进行处理: var obj

4.5K90

最常见的 20 个 jQuery 面试问题及答案

网页上有 5 个 div> 元素,如何使用 jQuery来选择它们?(答案)   另一个重要的 jQuery 问题是基于选择器的。...你如何使用jQuery来提取一个HTML 标记的属性 例如. 链接的href? (答案)   attr() 方法被用来提取任意一个HTML元素的一个属性的值....使用类“.active"来标记它们的未激活和激活状态,等等.   16. 使用 CDN 加载 jQuery 库的主要优势是什么 ? (答案)   这是一个稍微高级点儿的jQuery问题。...你如何使用jQuery来提取一个HTML 标记的属性 例如. 链接的href? (答案)   attr() 方法被用来提取任意一个HTML元素的一个属性的值....使用类“.active"来标记它们的未激活和激活状态,等等.   16. 使用 CDN 加载 jQuery 库的主要优势是什么 ? (答案)   这是一个稍微高级点儿的jQuery问题。

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

    Jump Start Bootstrap 第4章

    第一种根本不需要JavaScript,您只需要遵循一些推荐的HTML标记来使用它们。另一种需要一些JavaScript知识来初始化和定制这些插件。...这两种使用插件的方式,我们都将讨论,你可以选择最适合你的。 本章将使用的全部插件都包含在文件bootstrap.js或bootstrap.min.js中。...这将是一个包含类carousel-inner的div。每个幻灯片由一个具有类”item”的div>元素定义。每个项目都必须有一个表示图像和可选的文本数据。这个图像将被用作这个特殊的幻灯片项目的背景。...在您完成创建所有幻灯片之后,我们将构建一个用于导航carousel内容的控件部分。 carousel控制器是使用标记和一个类carouselcontrol和一个方向类(如左或右)构造的。...它是用来显示对话框提示的最佳插件之一,例如警告和确认对话框。您还可以使用它来展示一个更大的图像版本,显示一长串的术语和条件,或者显示注册/登录表单。

    28.4K40

    如何编写自己的jQuery插件?

    什么是jQuery插件? jQuery由原型对象组成,在某些时候可能需要一些操作和扩展。出于同样的目的,jQuery插件被设计为对象继承添加的任何其他方法的一种方式。...不仅如此,在创建jQuery对象时,这些附加方法并不是孤立的,而是在创建jQuery对象时使用其余的方法(已经继承的)调用。jQuery插件可以jQuery库中存在的各种方法的形式单独使用。...要理解jQuery是如何工作的,你需要遵循以下步骤: · 创建一个带有所有基本标记的HTML文档,并调用jQuery.js文件。...因此,当需要多个jQuery库时,使用$可能会产生冲突。因此,为了使我们能够将jQuery与其他插件一起使用。必须将代码放在立即调用函数的表达式中。这之后是jQuery的传递,然后命名它的参数$....添加私有方法和变量 在JavaScript中,函数包含多个变量和其他函数,这些变量和函数主要可以在函数内部访问,从而使元素成为私有。立即调用的函数表达式提供了访问私有变量和方法的最佳方法。

    1.7K10

    jQuery.data() 的实现方式

    jQuery.data() 的实现方式     jQuery.data() 的作用是为普通对象或 DOM Element 附加(及获取)数据。     ...下面将分三个部分分析其实现方式:      1. 用name和value为对象附加数据;即传入三个参数,第一个参数为需要附加数据的对象,第二个参数为数据的名称,第三个参数为数据的值。...用name和value为对象附加数据     使用 jQuery.data() 为普通对象附加数据时,其本质是将一个 “cache” 附加到了对象上,并使用了一个特殊的属性名称。     ...这种情况下,“another” 的属性名称和属性值将被视为多个键值对,从中提取的 “name” 和 “value” 都会被复制到目标对象的缓存中。      ...不能有效回收 DOM Element 上附加的对象引用),jQuery采用了与普通对象有所不同的方式附加数据。

    99670

    window的onload事件和domcontentloaded执行顺序

    jQuery的load事件 $(document).ready()或者$(function(){})是经常使用的,其原理都是使用了类似DOMContentLoaded。...这通常是在用户查看或与页面交互之前执行所需任务的好时机,例如添加事件处理程序和初始化插件。当通过对此方法的连续调用添加多个函数时,它们在DOM按照添加顺序准备就绪时运行。...但是,jQuery的.ready()方法以一种重要且有用的方式不同:如果DOM准备就绪并且DOMContentLoaded在代码调用之前浏览器触发.ready( handler ),则该函数handler...可以在jQuery中使用查看此事件$( window ).on( "load", handler )。如果代码依赖于加载的资源(例如,如果需要图像的尺寸),则应将代码放在load事件的处理程序中。...所以jq的ready事件执行结束时间和DOMContentLoaded结束时间并不是完全相同的,所以在使用过程中应当进行一些注意。

    3.7K10

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

    jQuery简单绑定事件的方式,可以让我绑定多个事件处理程序跟DOM2级绑定事件的方式一样....console.log('123456'); }); // jQuery绑定事件的事件方式:类似于我们的DOM2级绑定事件的方式 // 可以绑定多个事件处理程序。...这个方法是基本是的 .bind() 方法的一个变体。使用 .bind() 时,选择器匹配的元素会附加一个事件处理函数,而以后再添加的元素则不会有。为此需要再使用一次 .bind() 才行。...on()方法绑定事件处理程序到当前选定的jQuery对象中的元素。on汇总了bind和live两种绑定事件的方式。可以支持一般的bind方法或者委托的方法。...on()方法绑定事件处理程序到当前选定的jQuery对象中的元素。on汇总了bind和live两种绑定事件的方式。可以支持一般的bind方法或者委托的方法。

    6.5K00

    基于Html的SEO(很基础,更是前端必须掌握之点)

    如果是文章页,就要根据文章页的优化方法来使用H2,若按照最普通的页面布局,只有文章标题及正文内容,没有其他与正文同等级的信息,那么就可以对文章标题使用H2修饰,可以很清楚的告诉搜索引擎在文章页,我的文章标题就是页面的核心...,这是什么样的图片。...13、图像热点 除AltaVista、Google明确支持图像热点链接外,其他引擎暂不支持。当“蜘蛛” 程序遇到这种结构时,就会无法辨别。...因此尽量不要设置图像热点(Image Map)链接。 14、FLASH应用 FLASH由于不含文字信息,应尽量用于功能展示和广告,少用于网站栏目和页面。...如果页面中,用到多个圆角,则只管设置class为panel即可。 这样,我们可以减少HTML代码,实现了增加内容和HTML代码比的目的。

    1.1K51

    python测试开发django-191.Bootstrap3 轮播图(Carousel)

    在那里放置几乎任何可选的 HTML,它将自动对齐和格式化。 div class="item"> div> div> 用法 多个轮播 轮播需要在id最外面的容器 (the .carousel) 上使用 ,以便轮播控件正常运行。...添加多个轮播或更改轮播时id,请务必更新相关控件。 通过数据属性 使用数据属性轻松控制轮播的位置。data-slide接受关键字prevor next,它改变相对于当前位置的幻灯片位置。...该data-ride=”carousel”属性用于将轮播标记为在页面加载时开始动画。它不能与同一轮播的(冗余和不必要的)显式 JavaScript 初始化结合使用。...这两个事件都具有以下附加属性: direction: 轮播的滑动方向(”left”或”right”)。 relatedTarget: 作为活动项滑入到位的 DOM 元素。

    3.6K10

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

    jQuery简单绑定事件的方式,可以让我绑定多个事件处理程序跟DOM2级绑定事件的方式一样....(链式编程的原理) // 例如: $('#btn').click(function(){}); 1.2 jQuery简单绑定事件方式和DOM0级的区别 DOM0级绑定事件的方式 var btn =...这个方法是基本是的 .bind() 方法的一个变体。使用 .bind() 时,选择器匹配的元素会附加一个事件处理函数,而以后再添加的元素则不会有。为此需要再使用一次 .bind() 才行。...on()方法绑定事件处理程序到当前选定的jQuery对象中的元素。on汇总了bind和live两种绑定事件的方式。可以支持一般的bind方法或者委托的方法。...on()方法绑定事件处理程序到当前选定的jQuery对象中的元素。on汇总了bind和live两种绑定事件的方式。可以支持一般的bind方法或者委托的方法。

    2.7K80

    jQuery入门前言

    jQuery就是一个由JavaScript编写的轻量库,简单的说就是封装了一些JavaScript的操作,所以使用jQuery比使用原生的JavaScript可以达到用更少的代码做更多的事的效果。...image.png 12、表单对象属性筛选选择器: 除了表单元素选择器外,表单对象属性筛选选择器也是专门针对表单元素的选择器,可以附加在其他选择器的后面,主要功能是对所选择的表单元素进行筛选。...(如果有多个p标签,那么其他p标签里的文本内容也能获取到) alert($(".demo p").text());//会弹出 “baidu ”,所以该方法只能获取纯文本内容 //第二种用法...7、wrap()、unwrap()、wrapAll()和wrapInner()方法: 如果要将元素用其他元素包裹起来,也就是给它增加一个父元素,针对这样的处理,JQuery提供了一个wrap方法。...哈哈 div> div> 嘻嘻 div> 五、jQuery的遍历: jQuery的遍历有很多种方式,下面来看一下都如何使用。

    2.8K30

    全面入门jQuery最佳实践(二)-jQuery的属性与样式1 .attr()与.removeAttr()2 html()及.text()

    1 .attr()与.removeAttr() 每个元素都有一个或者多个特性,这些特性的用途就是给出相应元素或者其内容的附加信息。如:在img元素中,src就是元素的特性,用来标记图片的地址。...而在jQuery中用attr()与removeAttr()就可以全部搞定了,包括兼容问题 attr()获取和设置元素属性 attr(传入属性名):获取属性的值 attr(属性名, 属性值):设置属性的值...为了属性操作封装的,直接在一个 jQuery 对象上调用该方法,很容易对属性进行操作,也不需要去特意的理解浏览器的属性名不同的问题 dom概念的区分: Attribute和Property翻译出来都是...是这个DOM元素作为对象,其附加的内容,例如tagName, nodeName, nodeType,, defaultChecked, 和 defaultSelected 使用.prop()方法进行取值或赋值等....html只能使用在HTML文档中,.text 在XML 和 HTML 文档中都能使用 如果处理的对象只有一个子文本节点,那么html处理的结果与text是一样的 火狐不支持innerText属性

    67330

    jQuery Cheat—Sheet(jQuery学习笔记)

    ; 以上两种方式你可以选择你喜欢的方式实现文档就绪后执行jQuery方法。...jQuery对象选择符有三种:标签名、ID、类 可以单独使用,也可以与其他选择符组合使用 元素选择器 jQuery 元素选择器基于元素名选取元素。...不过,需要记住一件重要的事情:当使用 animate() 时,必须使用 Camel 标记法书写所有的属性名,比如,必须使用paddingLeft 而不是 padding-left,使用 marginRight...250px }); #### jQuery animate() - 操作多个属性 请注意,生成动画的过程中可同时使用多个属性: $(“button”).click(function(){ $(“...- 设置或返回所选元素的内容(包括 HTML 标记) - val() - 设置或返回表单字段的值 下面的例子演示如何通过 jQuery text() 和 html() 方法来获得内容: $(“#btn1

    16.2K30

    「首席架构师推荐」一系列很棒的的浏览器端JavaScript库资源

    nanobar - 非常轻量级的进度条。没有jQuery。 PageLoadingEffects - 使用SVG动画显示新内容的现代方式。 SpinKit - 使用CSS动画的加载指示符的集合。...文件上传器 jQuery-File-Upload - 文件上传小部件,包含多个文件选择,拖放支持,进度条,验证和预览图像,jQuery的音频和视频。...colorbox - 用于jQuery的轻量级可定制灯箱插件。 fancyBox - 一种工具,为您的网页上的图像,html内容和多媒体添加缩放功能提供了一种漂亮而优雅的方式。...Play-em JS - Play'em是一个JavaScript组件,它管理音乐/视频轨道队列,并通过在HTML DIV(包括Youtube,Soundcloud和Vimeo)中嵌入多个玩家来播放一系列歌曲...shuffle-images - 以创造性的方式改变图像的最简单方法 smoothState.js - 使用jQuery进行不显眼的页面转换。

    6.7K21

    「沙里淘金」精选浏览器端JavaScript库资源推荐

    nanobar - 非常轻量级的进度条。没有jQuery。 PageLoadingEffects - 使用SVG动画显示新内容的现代方式。 SpinKit - 使用CSS动画的加载指示符的集合。...文件上传器 jQuery-File-Upload - 文件上传小部件,包含多个文件选择,拖放支持,进度条,验证和预览图像,jQuery的音频和视频。...colorbox - 用于jQuery的轻量级可定制灯箱插件。 fancyBox - 一种工具,为您的网页上的图像,html内容和多媒体添加缩放功能提供了一种漂亮而优雅的方式。...Play-em JS - Play'em是一个JavaScript组件,它管理音乐/视频轨道队列,并通过在HTML DIV(包括Youtube,Soundcloud和Vimeo)中嵌入多个玩家来播放一系列歌曲...shuffle-images - 以创造性的方式改变图像的最简单方法 smoothState.js - 使用jQuery进行不显眼的页面转换。

    5.9K20

    扫码

    添加站长 进交流群

    领取专属 10元无门槛券

    手把手带您无忧上云

    扫码加入开发者社群

    相关资讯

    热门标签

    活动推荐

      运营活动

      活动名称
      广告关闭
      领券