jQuery
小辫子小何
无
展开
-
jQuery动画事件
show(time[,fn])–显示$('div').show() //默认是normal=400,而slow=600,fast=200注意show里面可以有参数,参数表示完成show动画所需要的时间,单位为ms。hide(time[,fn])–隐藏$('div').hide()注意:用法同show()。toggle(time[,fn])–显示隐藏(有则隐藏,无则显示)$('div').toggle()注意:用法同show()slideDown(time[,fn])–展开$('d原创 2020-06-30 12:17:41 · 239 阅读 · 0 评论 -
操作样式的方法css()
设置样式(设置所有被匹配的元素的样式)逐个设置$('div').css('color','red')$('div').css('background','yellow')$('div').css('width','100px')链式设置$('div').css('width','100px').css('height','100px').css('color','red')注意若链式操作超过三步,则使用逐个设置较好,避免影响代码的可读性。批量设置批量设置采用对象形式进行设置原创 2020-06-29 22:34:48 · 206 阅读 · 0 评论 -
文本值相关操作
(1)html()方法(与原生js的innerHtml方法相同)设置html:$('div').html('<p>jjj</p>') //为所有div设置子标签p。//亦可设置div内部的文本。$('div').html('uuuu') //设置所有div的文本为“uuuu”获取html:$('div').html() //获取第一个div的标签内的html。(2)text()方法(与原生js的innerText方法相同)为元素设置文本内容,此方法不能识别HTM原创 2020-06-29 22:14:18 · 137 阅读 · 0 评论 -
jQuery类操作方法
(1)addClass()为元素添加类,多个类之间用空格隔开,也可为多个同标签,同class的元素同时添加类。$('div').addClass('ab') //为所有div添加“ab”类(2)removeClass()删除类,多个类之间用空格隔开,也可为多个同标签,同class的元素同时删除类。$('div').removeClass('ab') //为所有div删除‘ab’类(3)toggleClass()切换类的存在状态,有则删除,无则添加。$('div').toggleClass原创 2020-06-29 21:41:37 · 159 阅读 · 0 评论 -
属性和属性结点及其操作方法
属性和属性结点什么是属性?对象身上保存的变量是属性如何操作属性?赋值:对象.属性名称=值取值:对象.属性赋值:对象[“属性”]=值取值:对象[“属性”]什么是属性节点?在HTML标签中添加的属性叫属性节点如何操作属性节点?DOM元素.setAtrribute("属性名称“,”属性值“)DOM元素.getAttribute(“属性名称”)注意:任何对象都有属性,只有DOM对象才有属性节点。操作属性节点方法(1)attr(name|pro|key,val,fn)作用:获取或设置属原创 2020-06-29 21:19:33 · 557 阅读 · 1 评论 -
jQuery内容选择器
:empty方法查找空的元素var $div =$("div:empty") //选择空div:parent方法选择有文本内容或有子元素的指定元素var $div = $("div:parent") //选择非空div:contains(text)方法找到包含指定文本内容的元素var $div =$("div:contains('我是谁')")//找出包含“我是谁”的div:has(selector)方法找到子元素有selector的父元素var $div = $("div:h原创 2020-06-29 15:49:09 · 69 阅读 · 0 评论 -
jQuery的静态方法
each方法原生js遍历forEach方法(只能遍历数组,不可遍历伪数组)arr.forEach((value,index)=>{}) //第一个参数为遍历到的项、第二个参数为索引,只能遍历数组,不能遍历伪数组。$.each()遍历(可遍历数组,也可遍历伪数组)$.each(arr,(index,value)=>{}) //接收两个参数,第一个参数为要遍历的数组,第2个参数为回调函数, //而回调函数可以接收两个参数,第一个参数为索引,第二个参数为数组项。map方法原创 2020-06-29 15:40:17 · 216 阅读 · 0 评论 -
jquery核心函数
$()的参数$():表示调用jQuery的核心函数(1)接收一个函数$(function(){})(2)接收一个字符串接收字符串选择器$('div')<div>哈哈哈</div>接收一个代码片段$('<p>急急急</p>') //将在dom树上创建结点p,通过append方法挂载到父元素上(3)接收一个DOM元素将DOM元素转换为jQuery对象...原创 2020-06-29 10:51:36 · 94 阅读 · 0 评论 -
jQuery入口函数
jQuery入口函数(1)ready():是jQuery中的函数,是准备的意思,当页面的DOM对象加载成功后会执行ready函数中的内容,相对于js中的onload事件。//标准写法$(document).ready(function(){})//简写$(function(){})//或者jQuery(function(){})//或者window.jQuery(function(){})//或者jQuery(document).ready(function(){})与js的wi原创 2020-06-29 10:23:38 · 620 阅读 · 0 评论 -
第三方模块
什么是第三方模块具有特定功能,能直接使用的模块叫第三方模块,通常都是由多个文件组成并且被放置在一个文件夹中,有称为包。两种形式(1)以js文件存在,提供实现项目具体功能的API接口(2)以命令行工具的形式存在,辅助项目开发获取第三方模块npm(node package manager):node的第三方模块管理工具,又叫node的包管理工具。下载:npm install 模块名称卸载:npm uninstall 模块名称本地安装:库文件一般使用本地安装全局安装:命令行工具一般使用全局安原创 2020-06-26 16:34:46 · 452 阅读 · 0 评论 -
jQuery位置
offset()设置或获取元素偏移(1)offset()方法设置或返回被选元素相对于文档的偏移坐标,与父级元素无关(子绝父相也不能改变offset()方法计算偏移位置的相对于文档计算的情况)(2)设置元素的偏移:offset({top:200,left:200}) //top和left的值为数字,不带单位,当通过offset().left取值时,返回的也是数字。position()获取元素偏移(1)position()方法用于返回被选元素相对于带有定位的父级偏移坐标,如果父级都没有定位,则以文档原创 2020-06-24 17:50:16 · 191 阅读 · 0 评论 -
jQuery尺寸
(1)width()/height() --匹配元素的宽度和高度,只是元素内容的宽度和高度。若()里面有数字,可以直接修改元素内容的宽度和高度。(2)innerHeight()/innerWidth()–匹配元素内容高度/宽度+padding值。(3)outerHeight()/outerWidth()–匹配元素内容高度/宽度+padding值+border值。(4)outerHeight(true)/outerWidth(true)–匹配元素内容的高度/宽度+padding值+border值+mar原创 2020-06-24 17:09:21 · 96 阅读 · 0 评论 -
jQuery多库共存
jQuery利用作为标识符,可能会与其他的js库冲突,jQuery的多库共存是为了解决作为标识符,可能会与其他的js库冲突,jQuery的多库共存是为了解决作为标识符,可能会与其他的js库冲突,jQuery的多库共存是为了解决符冲突问题。(1)可直接用jQuery代替$通过$.noConflict()释放用户对$的控制权,用户可以自己命名来使用jQuery中的方法。(2)var otherName = $.noConflict() //之后可直接使用otherName来代替$....原创 2020-06-23 11:53:27 · 189 阅读 · 1 评论 -
jQuery对象拷贝
将某个对象拷贝给另一个对象使用,可以使用$.extend()语法:$.extend([deep],target,oriObj1,[oriObj2...])其中:deep默认为false,表示浅拷贝,当去true时表示深拷贝。target表示要拷贝到的对象。oriObj1~n表示被拷贝到的那个对象。浅拷贝与深拷贝的区别:浅拷贝拷贝复杂对象类型时,拷贝的是其地址,所以如果源对象与目标对象的复杂对象类型的键名一样时,则源对象的复杂对象类型将被目标对象的复杂对象类型直接替代,而不会管复杂对象类型内部原创 2020-06-23 11:25:35 · 3143 阅读 · 0 评论 -
jQuery事件
(1)事件处理on()绑定事件on()方法在匹配元素上绑定一个或者多个事件的事件处理函数语法:element.on(events,[selector],fn)注意:events:一个或多个用空格绑定的事件类型;selector:元素的子元素选择器;fn:回调函数,及绑定在element身上的函数。例子1:$("div").on( { mouseenter:functionn(){ $(this).css("background","blue"); }, { click:functi原创 2020-06-23 09:46:16 · 132 阅读 · 0 评论 -
jQuery元素操作
遍历元素(1)each方法语法1:$("div").each((index,domEle)=>{XXX}注意:each方法的第一个参数是元素的索引,第二个参数是DOM元素,要使用jQuery方法,需要将该DOM元素转换为jQuery对象,转换方法为$(domEle)。语法2:$.each(Object,(i,elem)=>{xxx})注意:参数同语法1一样,但是该方法可以遍历数组或者对象来进行数据的处理。创建元素1)创建元素:var li= $("&.原创 2020-06-22 22:54:35 · 123 阅读 · 0 评论