jq页面加载事件 jquery页面加载前执行事件

JQuery顾名思义就是JavaScript和Query。jQuery是免费和开源的。可以简化查询DOM对象、处理事件、制作动画、处理Ajax交互,兼容多种浏览器的javascript库。核心思想是少写多做

本文最后更新时间:  2023-03-24 13:04:06

JQuery顾名思义就是JavaScript和Query。jQuery是免费和开源的。可以简化查询DOM对象、处理事件、制作动画、处理Ajax交互,兼容多种浏览器的javascript库。核心思想是少写多做(少写多做)。

jQuery的优势

体积小,使用灵巧(只需引入一个js文件)。方便的选择页面元素(模仿CSS选择器更精确、灵活)。动态更改页面样式/页面内容(操作DOM,动态添加、移除样式)。控制响应事件(动态添加响应事件)。提供基本网页特效(提供已封装的网页特效方法)。快速实现通信(ajax)。易扩展、插件丰富。支持链式写法。

I. jQuery选择器

ID选择器:$(“#box”);类名选择器:$(“.box”);标签选择器:$(“div”);后代选择器:$(“#box p”);:first:获取第一个元素。:last:获取最后一个元素。:even:匹配所有索引值为偶数的元素,从 0 开始计数。:odd:匹配所有索引值为奇数的元素,从 0 开始计数。:eq(index):匹配一个给定索引值的元素,从 0 开始计数。:not(selector):去除所有与给定选择器匹配的元素。:has(selector):匹配含有选择器所匹配的元素的元素。

第二,jQuery属性和样式CSS

操作属性:

Attr (name | properties | key,value | fn):设置或返回选定元素的属性值。

RemoveAttr(name):从每个匹配的元素中删除一个属性。

Prop (name | properties | key,value | fn):获取匹配元素集中第一个元素的属性值。

RemoveProp(name):用于删除由。prop()方法。

区别:attr可以操作(添加、删除、检查)用户自定义的节点属性,而prop不能(添加、删除、检查)。对于输入的禁用属性,Attr和prop具有不一致的返回值。attr返回disabled或undefined,而prop返回布尔值。

操作类:

AddClass(class|fn):为每个匹配的元素添加指定的类名。

RemoveClass([class|fn]):从所有匹配的元素中删除所有或指定的类。

Togleclass (class | fn [,switch]):删除(添加)一个存在的类(不存在)。

操作内容:

Html([val|fn]):获取第一个匹配元素的Html内容。该函数不能在XML文档中使用。但是可以在XHTML文档中使用。

Text([val|fn]):获取所有匹配元素的内容。结果是由所有匹配元素中包含的文本内容组成的文本。这个方法对HTML和XML文档都有效。

Val([val|fn|arr]):获取匹配元素的当前值。如果进行了多项选择,将返回包含所选值的数组。

CSS操作:

Css(name|pro|[,val|fn]):访问匹配元素的样式属性。

操作位置:

Offset([coordinates]):获取当前文档中匹配元素的相对偏移量。返回的对象包含两个整数属性:top和left,以像素为单位。方法仅对可见元素有效。

Position():获取匹配元素相对于父元素的偏移量。返回的对象包含两个整数属性:top和left。要精确计算结果,请在填充、边框和填充属性中使用像素单位。此方法仅对可见元素有效。

ScrollTop([val]):获取匹配元素距滚动条顶部的偏移量。此方法对可见元素和隐藏元素都有效。

ScrollLeft([val]):获取匹配元素距滚动条左侧的偏移量。此方法对可见元素和隐藏元素都有效。

操作尺寸:

Height([val|fn]):获取匹配元素的当前计算高度值(px)。

Width([val|fn]):获取第一个匹配元素的当前计算宽度值(px)。

InnerHeight():获取第一个匹配元素的内部区域的高度(包括填充,不包括边框)。此方法对可见元素和隐藏元素都有效。

InnerWidth():获取第一个匹配元素的内部区域的宽度(包括填充,不包括边框)。此方法对可见元素和隐藏元素都有效。

Outheight ([options]):获取第一个匹配元素的外部高度(默认情况下包括填充和边框)。此方法对可见元素和隐藏元素都有效。

OuterWidth([options]):获取第一个匹配元素的外部宽度(默认情况下包括填充和边框)。此方法对可见元素和隐藏元素都有效。

注意:将选项设置为true,包括边距。

第三,过滤和搜索

过滤元素:

Eq(index|-index):获取第n个元素。该元素的位置从0开始计数。如果是负数,它将从集合中的最后一个元素开始倒数。

First():获取第一个元素。

Last():获取最后一个元素。

HasClass(class):检查当前元素是否包含特定的类,如果包含,则返回true。

Has(expr|ele):保留包含特定后代的元素,删除不包含后代的元素。

Not(expr|ele|fn):删除与指定表达式匹配的元素。

查找元素:

Children([expr]):获取包含匹配元素集中每个元素的所有子元素的元素集。只考虑子元素,而不是所有的后代元素。

Find(expr|obj|ele):搜索与指定表达式匹配的所有子元素。

Parent([expr]):获取包含所有匹配元素的唯一父元素的元素集。

OffsetParent():返回第一个匹配元素用于定位的父节点。

Next([expr]):获取一个元素集,该元素集包含匹配元素集中每个元素的下一个同级元素。

Next ([expr]):查找当前元素之后的所有对等元素。

Prev([expr]):获取一个元素集,该元素集包含匹配元素集中每个元素的前一个兄弟元素。

PrevAll([expr]):查找当前元素之前的所有对等元素。

Siblings([expr]):获取一个元素集,该元素集包含匹配元素集中每个元素的所有唯一对等元素。您可以使用可选表达式进行筛选。

系列操作:

Add(expr|ele|html|obj[,con]):将与表达式匹配的元素添加到jQuery对象中。这个函数可以用来连接分别匹配两个表达式的元素的结果集。返回的结果将总是按照元素在HTML文档中出现的顺序进行排序,而不是简单地将它们相加。

AndSelf():将以前选择的添加到当前元素中。

End():回到最近的一个”破坏性”手术前。也就是说,匹配的元素列表被改变到先前的状态。如果之前没有破坏性操作,则返回一组空。所谓”破坏性”它是指任何改变匹配的jQuery元素的操作。

四。jQuery事件

页面加载事件:

Ready(fn):绑定一个函数,在DOM加载并准备好进行查询和操作时执行。这是事件模块中最重要的功能,因为它可以大大提高web应用程序的响应速度。简单地说,这个方法纯粹是用window.load事件注册事件的替代方法。

绑定事件:

On(events,[selector],[data],fn):将一个或多个事件绑定到选定元素的事件处理程序。

Off(events,[selector],[fn]):删除选定元素上的一个或多个事件的事件处理程序。

Bind(type,[data],fn):为每个匹配元素的特定事件绑定事件处理函数。

Unbind (type,[data | fn]]):bind()的反向操作,从每个匹配的元素中删除绑定的事件。如果没有参数,所有绑定的事件都会被删除。

One(type,[data],fn):为每个匹配元素的特定事件(比如click)绑定一个一次性事件处理程序。

悬停([over,]out):当鼠标移动到匹配的元素上时,将触发指定的第一个函数。当鼠标移出该元素时,将触发指定的第二个功能。

Click([[data],fn]):触发每个匹配元素的Click事件。该函数调用并执行绑定到click事件的所有函数。

注意:其他事件方法也以同样的方式使用。例如:mouseover、mouseout、dblclick、change、blur、focus、keydown、keyup、keypress、mousedown、mouseup、mousemove、mouseenter、mouseleave、resize、scroll、select、submit、unload等。

温馨提示:内容均由网友自行发布提供,仅用于学习交流,如有版权问题,请联系我们。