下载安卓APP箭头
箭头给我发消息

客服QQ:3315713922

web前端:jQuery随笔记录

作者:把番茄沉入海底     来源: https://www.cnblogs.com/449house/p/11944354.html点击数:689发布时间: 2020-03-15 09:03:16

标签: 计算机jQuerycss

Web开发

  运行jQuery所需的条件很简单:一台计算机、一个智能电话或一个可以运行现代浏览器的设备。jQuery对浏览器的要求也相当自由。

  DOM遍历

  parent()方法返回所选元素的直接父元素。(parent()只能遍历单个级别的DOM树)

  parents()方法获取所选元素的所有祖先

  children()所选元素的所有直接子元素

  siblings()所有兄弟元素

  next()/nextAll()下一个兄弟元素/下面所有兄弟元素

  prev()/prevAll()上一个兄弟元素/上面所有的兄弟元素1

  eq()具有特定索引号的元素

  (例如,如果页面包含多个div元素,并且我们要选择第三个元素:)

  $("div").eq(2);

  删除元素

  remove删除选中元素

  empty()方法用于删除所选元素的子元素。

  事件处理

  当触发事件时执行的函数称为事件处理程序。

  鼠标事件:

  click:单击时发生。

  dblclick:双击元素时触发。

  mouseenter:当鼠标指针进入所选元素时触发。

  mouseleave:鼠标指针离开所选元素时触发。

  mouseover:当鼠标指针在所选元素上方悬停时触发。

  键盘事件:

  keydown:当按下键盘按键时会触发。

  keyup:当键盘按键被释放时会触发。

  表单事件:

  submit:提交表单时触发。

  change:当表单元素的值发生改变时触发。

  focus:当表单元素获得焦点时触发。

  blur:当表单元素失去焦点时触发。

  文件事件:

  ready:当DOM加载完成以后触发。

  resize:当浏览器窗口大小改变时触发。

  scroll:当用户在指定的元素中滚动滚动条时触发。

  on()方法绑定事件

  on()方法用于将相同的处理函数绑定到多个事件中的时候。可以使用空格分隔多个事件名称,例如可以为点击和双击事件使用相同的事件处理程序。

  $("p").on("clickdblclick",function(){

  alert("clicked");

  });

  (on()方法在被选元素及子元素上添加一个或多个事件处理程序。)

  off()解除事件绑定

  使用off()方法来删除事件处理程序。

  $(“div”).on(“click”,function(){

  alert(‘Hithere!’);

  });

  $(“div”).off(“click”);

  off()方法的参数是要删除的事件名称。

  JQuery的事件对象

  每个事件处理函数都可以接收一个事件对象,其中包含与该事件相关的属性和方法:

  pageX,pageY事件发生时相对于页面左上角的鼠标位置(X和Y坐标)。

  type键入事件的类型(例如“点击”)。

  which哪个按钮或键被按下。

  data数据绑定事件时传入的任何数据。

  target定位发起事件的DOM元素。

  preventDefault()阻止事件的默认动作(例如,在链接之后)。

  stopPropagation()停止冒泡到其他元素的事件。

  例如:点击时提醒鼠标位置,并阻止打开链接:

  $(“a”).click(function(event){

  alert(event.pageX);

  event.preventDefault();

  });

  事件对象作为参数(就是以上代码中的event参数)传递给事件处理函数。

  JQuery触发事件

  使用trigger()方法以编程方式触发事件。例如,你可以触发一个点击事件,而不需要用户实际点击一个元素:

  $(“div”).click(function(){

  alert(“点击了div!”);

  });

  $(“div”).trigger(“click”);

  trigger()方法不能用来模仿本机浏览器事件,比如点击一个文件文本框。只能处理jQuery事件系统中的事件。

  jQuery的选择机制构建于css的选择器,它提供了快速查询DOM文档中元素的能力,而且大大强化了Javascript中获取页面元素的方式。

赞(11)
踩(0)
分享到:
华为认证网络工程师 HCIE直播课视频教程