当前栏目
jQuery基础(五)一Ajax应用与常用插件-imooc
第1章 jQuery 实现Ajax应用
本章介绍jQuery中支持Ajax的各种方法和函数,阐述通过Ajax交互的过程与常用方法,重点介绍核心方法$.ajax()的运用技巧。通过ajax全局事件的介绍,进一步巩固前面所学基础内容。
- 1-1 使用load()方法异步请求数据
- 1-2 使用getJSON()方法异步加载JSON格式数据
- 1-3 使用getScript()方法异步加载并执行js文件
- 1-4 使用get()方法以GET方式从服务器获取数据
- 1-5 使用post()方法以POST方式从服务器发送数据
- 1-6 使用serialize()方法序列化表单元素值
- 1-7 使用ajax()方法加载服务器数据
- 1-8 使用ajaxSetup()方法设置全局Ajax默认选项
- 1-9 使用ajaxStart()和ajaxStop()方法
- 1-10 练习题
- 1-11 编程练习
第2章 jQuery 常用插件
本章节先通过示例与插件相结合的方式,详细介绍了目前最为流行的各类插件的使用方法和技巧,包括表单插件、图片插件等;然后,介绍了如何自定义编写对象和类级别插件的过程。
- 2-1 表单验证插件——validate
- 2-2 表单插件——form
- 2-3 图片灯箱插件——lightBox
- 2-4 图片放大镜插件——jqzoom
- 2-5 cookie插件——cookie
- 2-6 搜索插件——autocomplete
- 2-7 右键菜单插件——contextmenu
- 2-8 自定义对象级插件——lifocuscolor插件
- 2-9 自定义类级别插件—— twoaddresult
- 2-10 练习题
第3章 jQuery UI型插件
本章介绍包括拖曳、放置、排序在内的各类UI插件的使用过程,介绍各类微型插件的使用方法和注意事项,以及最新版UI中菜单工具、微调按钮、工具提示插件的效果和使用方法。
- 3-1 拖曳插件——draggable
- 3-2 放置插件——droppable
- 3-3 拖曳排序插件——sortable
- 3-4 面板折叠插件——accordion
- 3-5 选项卡插件——tabs
- 3-6 对话框插件——dialog
- 3-7 菜单工具插件——menu
- 3-8 微调按钮插件——spinner
- 3-9 工具提示插件——tooltip
- 3-10 练习题
第4章 jQuery 工具类函数
本章先介绍浏览器检测函数,然后,介绍jQuery各类测试类型函数的使用方法,同时,还介绍了字符串、URL操作函数的使用技巧,最后,介绍了使用$.extend()方法扩展工具函数和Object对象的方法
- 4-1 获取浏览器的名称与版本信息
- 4-2 检测浏览器是否属于W3C盒子模型
- 4-3 检测对象是否为空
- 4-4 检测对象是否为原始对象
- 4-5 检测两个节点的包含关系
- 4-6 字符串操作函数
- 4-7 URL操作函数
- 4-8 使用$.extend()扩展工具函数
- 4-9 使用$.extend()扩展Object对象
- 4-10 练习题
- 4-11 编程挑战
jQuery 实现Ajax应用
使用load()方法异步请求数据
使用load()方法通过Ajax请求加载服务器中的数据,并把返回的数据放置到指定的元素中,它的调用格式为:
load(url,[data],[callback])
参数url为加载服务器地址,可选项data参数为请求时发送的数据,callback参数为数据请求成功后,执行的回调函数
例如,点击“加载”按钮时,向服务器请求加载一个指定页面的内容,加载成功后,将数据内容显示在<div>元素中,并将加载按钮变为不可用。如下图所示:
$(function () {
$("#btnShow").bind("click", function () {
var $this = $(this);
$("ul")
.html("<img src='Images/Loading.gif' alt='x'/>")
.load("https://www.imooc.com/data/fruit_part.html",function(){
$this.attr("disabled", "true");
});
})
});
var $this = $(this)
- this其实是一个HTML元素
- this 只是个变量名,加"
- 而$(this)是个转换,将this表示的dom对象转换为jquery对象,这样就可以使用jquery提供的方法操作
- 声明一个叫$this的jquery对象变量, 给声明的变量赋值,赋的值是将this的HTML元素转换为jQuery对象。
.html:load还未加载完成的时候将ul里的内容显示该图片
当点击“加载”按钮时,通过调用load()方法向服务器请求加载fruit.html文件中的内容
$this.attr("disabled", "true"):load加载完成后将按钮变为不可用。
在浏览器中显示的效果:
使用getJSON()方法异步加载JSON格式数据
使用getJSON()方法可以通过Ajax异步请求的方式,获取服务器中的数据,并对获取的数据进行解析,显示在页面中,它的调用格式为:
jQuery.getJSON(url,[data],[callback])或$.getJSON(url,[data],[callback])
其中,url参数为请求加载json格式文件的服务器地址,可选项data参数为请求时发送的数据,callback参数为数据请求成功后,执行的回调函数
例如,点击页面中的“加载”按钮,调用getJSON() 方法获取服务器中JSON格式文件中的数据,并遍历数据,将指定的字段名内容显示在页面中。如下图所示:
$(function () {
$("#btnShow").bind("click", function () {
var $this = $(this);
$.getJSON("https://www.imooc.com/data/sport.json",function(data){
$this.attr("disabled", "true");
$.each(data, function (index, sport) {
$("ul").append("<li>" + index + sport["name"] + "</li>");
/*if(index==3)
$("ul").append("<li>" + sport["name"] + "</li>");*/
});
});
})
});
$.each(data, function(index, ele){})
- data:要遍历的集合, index:索引值, ele:集合中的子元素
- 第一种遍历 (obj).each(function(index,value){ }) 在对象上调用each函数 第二种遍历 .each(obj,function(index,value){ }) 这种是把obj 当作对象传入 函数 each 道理是一样的
当点击“加载”按钮时,通过getJSON()方法调用服务器中的sport.json文件
获取返回的data文件数据,并遍历该数据对象
以data[“name”]取出数据中指定的内容,显示在页面中。在浏览器中显示的效果:
使用getScript()方法异步加载并执行js文件
使用getScript()方法异步请求并执行服务器中的JavaScript格式的文件,它的调用格式如下所示:
jQuery.getScript(url,[callback])或$.getScript(url,[callback])
使用get()方法以GET方式从服务器获取数据
使用get()方法时,采用GET方式向服务器请求数据,并通过方法中回调函数的参数返回请求的数据,它的调用格式如下:
$.get(url,[callback])
例如,当点击“加载”按钮时,调用get()
方法向服务器中的一个.php文件以GET方式请求数据,并将返回的数据内容显示在页面中,如下图所示:
返回 json 数据类型,GET请求会将参数跟在URL后进行传递
使用post()方法以POST方式从服务器发送数据
post()方法用于以POST方式向服务器发送数据,服务器接收到数据之后,进行处理,并将处理结果返回页面,调用格式如下:
$.post(url,[data],[callback])
例如,在输入框中录入一个数字,点击“检测”按钮,调用post()
方法向服务器以POST方式发送请求,检测输入值的奇偶性,并显示在页面中,如下图所示:
<?php _POST['num'] : 0; if(num > 0){ echo '大于0'; }else if(
当点击“检测”按钮时,获取输入框中的值,并将该值使用$.post()
方法一起发送给服务器,服务器接收该值后并进行处理,最后返回处理结果。
使用serialize()方法序列化表单元素值
使用serialize()方法可以将表单中有name属性的元素值进行序列化,生成标准URL编码文本字符串,直接可用于ajax请求,它的调用格式如下:
$(selector).serialize()
其中selector参数是一个或多个表单中的元素或表单元素本身
例如,在表单中添加多个元素,点击“序列化”按钮后,调用serialize()
方法,将表单中元素全部序列化,生成标准URL编码,各元素间通过&号相联。
使用ajax()方法加载服务器数据
使用ajax()方法是最底层、功能最强大的请求服务器数据的方法,它不仅可以获取服务器返回的数据,还能向服务器发送请求并传递数值,它的调用格式如下:
jQuery.ajax([settings])或$.ajax([settings])
其中参数settings为发送ajax请求时的配置对象,在该对象中,url表示服务器请求的路径,data为请求时传递的数据,dataType为服务器返回的数据类型,success为请求成功的执行的回调函数,type为发送数据请求的方式,默认为get
例如,点击页面中的“加载”按钮,调用ajax()
方法向服务器请求加载一个txt文件,当请求成功时调用success回调函数,获取传回的数据,并显示在页面中。
使用ajaxSetup()方法设置全局Ajax默认选项
使用ajaxSetup()方法可以设置Ajax请求的一些全局性选项值,设置完成后,后面的Ajax请求将不需要再添加这些选项值,它的调用格式为:
jQuery.ajaxSetup([options])或$.ajaxSetup([options])
可选项options参数为一个对象,通过该对象设置Ajax请求时的全局选项值
例如,先调用ajaxSetup()
方法设置全局的Ajax选项值,再点击两个按钮,分别使用ajax()
方法请求不同的服务器数据,并将数据内容显示在页面,如下图所示:
使用ajaxStart()和ajaxStop()方法
ajaxStart()和ajaxStop()方法是绑定Ajax事件。ajaxStart()方法用于在Ajax请求发出前触发函数,ajaxStop()方法用于在Ajax请求完成后触发函数。它们的调用格式为:
$(selector).ajaxStart(function())和$(selector).ajaxStop(function())
其中,两个方法中括号都是绑定的函数,当发送Ajax请求前执行ajaxStart()方法绑定的函数,请求成功后,执行ajaxStop ()方法绑定的函数
例如,由于使用ajaxStart()
和ajaxStop()
方法绑定了动画元素,因此,在开始发送Ajax请求时,元素显示,请求完成时,动画元素自动隐藏。
jQuery 常用插件
表单验证插件——validate
该插件自带包含必填、数字、URL在内容的验证规则,即时显示异常信息,此外,还允许自定义验证规则,插件调用方法如下:
$(form).validate({options})
其中form参数表示表单元素名称,options参数表示调用方法时的配置对象,所有的验证规则和异常信息显示的位置都在该对象中进行设置
例如,当点击表单中的“提交”按钮时,调用validate插件验证用户名输入是否符合规则,并将异常信息显示在页面中,如下图所示:
表单插件——form
通过表单form插件,调用ajaxForm()方法,实现ajax方式向服务器提交表单数据,并通过方法中的options对象获取服务器返回数据,调用格式如下:
$(form). ajaxForm ({options})
其中form参数表示表单元素名称;options是一个配置对象,用于在发送ajax请求过程,设置发送时的数据和参数
<script type="text/javascript">
$(function () {
var options = {
url: "http://www.imooc.com/data/form_f.php",
target: ".tip"
}
$(#frmV).ajaxForm(options);
});
</script>
- ajaxform和ajaxsubmit:http://www.cnblogs.com/china-li/archive/2012/12/12/2800144.html
图片灯箱插件——lightBox
该插件可以用圆角的方式展示选择中的图片,使用按钮查看上下张图片,在加载图片时自带进度条,还能以自动播放的方式浏览图片,调用格式如下:
$(linkimage).lightBox({options})
其中linkimage参数为包含图片的<a>元素名称,options为插件方法的配置对象
例如,以列表的方式在页面中展示全部的图片,当用户单击其中某张图片时,通过引入的图片插件,采用“灯箱”的方式显示所选的图片,如下图所示:
图片放大镜插件——jqzoom
在调用jqzoom图片放大镜插件时,需要准备一大一小两张一样的图片,在页面中显示小图片,当鼠标在小图片中移动时,调用该插件的jqzoom()方法,显示与小图片相同的大图片区域,从而实现放大镜的效果,调用格式如下:
$(linkimage).jqzoom({options})
其中linkimage参数为包含图片的<a>元素名称,options为插件方法的配置对象
例如,在页面中,添加一个被<a>元素包含的图片元素,当在图片元素中移动鼠标时,在图片的右边,将显示放大后的所选区域效果,如下图所示:
cookie插件——cookie
使用cookie插件后,可以很方便地通过cookie对象保存、读取、删除用户的信息,还能通过cookie插件保存用户的浏览记录,它的调用格式为:
保存:$.cookie(key,value);读取:$.cookie(key),删除:$.cookie(key,null)
其中参数key为保存cookie对象的名称,value为名称对应的cookie值
例如,当点击“设置”按钮时,如果“是否保存用户名”的复选框为选中状态时,则使用cookie对象保存用户名,否则,删除保存的cookie用户名
搜索插件——autocomplete
搜索插件的功能是通过插件的autocomplete()方法与文本框相绑定,当文本框输入字符时,绑定后的插件将返回与字符相近的字符串提示选择,调用格式如下:
$(textbox).autocomplete(urlData,[options]);
其中,textbox参数为文本框元素名称,urlData为插件返回的相近字符串数据,可选项参数options为调用插件方法时的配置对象
例如,当用户在文本框输入内容时,调用搜索插件的autocomplete()
方法返回与输入内容相匹配的字符串数据,显示在文本框下,提示选择,如下图所示:
右键菜单插件——contextmenu
右键菜单插件可以绑定页面中的任意元素,绑定后,选中元素,点击右键,便通过该插件弹出一个快捷菜单,点击菜单各项名称执行相应操作,调用代码如下:
$(selector).contextMenu(menuId,{options});
Selector参数为绑定插件的元素,meunId为快捷菜单元素,options为配置对象
例如,选中页面<textarea>元素,点击右键,弹出插件绑定的快捷菜单,点击菜单中的各个选项,便在页面中显示操作的对应名称。如下图所示:
自定义对象级插件——lifocuscolor插件
自定义的lifocuscolor插件可以在<ul>元素中,鼠标在表项<li>元素移动时,自定义其获取焦点时的背景色,即定义<li>元素选中时的背景色,调用格式为:
$(Id).focusColor(color)
其中,参数Id表示<ul>元素的Id号,color表示<li>元素选中时的背景色
<script type="text/javascript">
自定义类级别插件—— twoaddresult
通过调用自定义插件twoaddresult中的不同方法,可以实现对两个数值进行相加和相减的运算,导入插件后,调用格式分别为:
$.addNum(p1,p2) 和 $.subNum(p1,p2)
上述调用格式分别为计算两数值相加和相减的结果,p1和p2为任意数值
<script type="text/javascript">
$(function () {
$("#btnCount").bind("click", function () {
$("#Text3").val(
$.subNum($("#Text1").val(),
$("#Text2").val())
);
});
});
</script>
3-1拖曳插件——draggable
拖曳插件draggable的功能是拖动被绑定的元素,当这个jQuery UI插件与元素绑定后,可以通过调用draggable()
方法,实现各种拖曳元素的效果,调用格式如下:
$(selector). draggable({options})
options参数为方法调用时的配置对象,根据该对象可以设置各种拖曳效果,如“containment”属性指定拖曳区域,“axis”属性设置拖曳时的坐标方向。
3-2放置插件——droppable
除使用draggable插件拖曳任意元素外,还可以调用droppable UI插件将拖曳后的任意元素放置在指定区域中,类似购物车效果,调用格式如下:
$(selector).droppable({options})
selector参数为接收拖曳元素,options为方法的配置对象,在对象中,drop函数表示当被接收的拖曳元素完全进入接收元素的容器时,触发该函数的调用。
例如,在页面中,通过调用droppable插件将“产品区”中的元素拖曳至“购物车”中,同时改变“购物车”的背景色和数量值,如下图所示:
3-3拖曳排序插件——sortable
拖曳排序插件的功能是将序列元素(例如<option>、<li>)按任意位置进行拖曳从而形成一个新的元素序列,实现拖曳排序的功能,它的调用格式为:
$(selector).sortable({options});
selector参数为进行拖曳排序的元素,options为调用方法时的配置对象,
例如,在页面中,通过加载sortable插件将<ul>元素中的各个<li>表项实现拖曳排序的功能,如下图所示:
在浏览器中显示的效果:
3-4面板折叠插件——accordion
面板折叠插件可以实现页面中指定区域类似“手风琴”的折叠效果,即点击标题时展开内容,再点另一标题时,关闭已展开的内容,调用格式如下:
$(selector).accordion({options});
其中,参数selector为整个面板元素,options参数为方法对应的配置对象。
3-5选项卡插件——tabs
使用选项卡插件可以将<ul>中的<li>选项定义为选项标题,在标题中,再使用<a>元素的“href”属性设置选项标题对应的内容,它的调用格式如下:
$(selector).tabs({options});
selector参数为选项卡整体外围元素,该元素包含选项卡标题与内容,options参数为tabs()
方法的配置对象,通过该对象还能以ajax方式加载选项卡的内容。
3-6对话框插件——dialog
对话框插件可以用动画的效果弹出多种类型的对话框,实现JavaScript代码中alert()
和confirm()
函数的功能,它的调用格式为:
$(selector).dialog({options});
selector参数为显示弹出对话框的元素,通常为<div>,options参数为方法的配置对象,在对象中可以设置对话框类型、“确定”、“取消”按钮执行的代码等。
例如,当点击“提交”按钮时,如果文本框中的内容为空,则通过dialog插件弹出提示框,提示输入内容不能为空,如下图所示:
在浏览器中显示的效果:
3-7菜单工具插件——menu
菜单工具插件可以通过<ul>创建多级内联或弹出式菜单,支持通过键盘方向键控制菜单滑动,允许为菜单的各个选项添加图标,调用格式如下:
$(selector).menu({options});
selector参数为菜单列表中最外层<ul>元素,options为menu()
方法的配置对象。
3-8微调按钮插件——spinner
微调按钮插件不仅能在文本框中直接输入数值,还可以通过点击输入框右侧的上下按钮修改输入框的值,还支持键盘的上下方向键改变输入值,调用格式如下:
$(selector).spinner({options});
selector参数为文本输入框元素,可选项options参数为spinner()
方法的配置对象,在该对象中,可以设置输入的最大、最小值,获取改变值和设置对应事件。
3-9提示插件——tooltip
工具提示插件可以定制元素的提示外观,提示内容支持变量、Ajax远程获取,还可以自定义提示内容显示的位置,它的调用格式如下:
$(selector).tooltip({options});
其中selector为需要显示提示信息的元素,可选项参数options为tooltip()
方法的配置对象,在该对象中,可以设置提示信息的弹出、隐藏时的效果和所在位置。
例如,将三个<a>元素与工具提示插件相绑定,当把鼠标移动在<a>元素内容时,以动画效果弹出对应的提示图片,移出时,图片自动隐藏,如下图所示:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "https://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="https://www.w3.org/1999/xhtml">
<head>
<title>工具提示插件</title>
<link href="https://www.imooc.com/data/jquery-ui.css" rel="stylesheet" type="text/css" />
<link href="style.css" rel="stylesheet" type="text/css" />
<script src="https://www.imooc.com/data/jquery-1.8.2.min.js" type="text/javascript"></script>
<script src="https://www.imooc.com/data/jquery-ui-1.9.2.min.js" type="text/javascript"></script>
</head>
<body>
<div id="divtest">
<div class="title">
工具提示插件</div>
<div class="content">
<div id="tooltip">
<label for="name">
姓名</label>
<input id="name" name="name" title="你猜呀" />
<br><br><br>
<label for="sex">
性别</label>
<input id="sex" name="sex" title="我是大屌萌妹,嘤嘤嘤" />
<br><br><br>
<label for="age">
年龄</label>
<input id="age" name="age" title="芳龄14,初中二年级" />
</div>
</div>
</div>
<script type="text/javascript">
$(function () {
$("#tooltip").tooltip({
show: {
effect: "slideDown",
delay: 350
},
hide: {
effect: "explode",
delay: 350
},
position: {
my: "left top",
at: "left bottom"
}
});
});
</script>
</body>
</html>
4-1获取浏览器的名称与版本信息
在jQuery中,通过.browser对象可以获取浏览器的名称和版本信息,如.browser.chrome为true,表示当前为Chrome浏览器,.browser.mozilla为true,表示当前为火狐浏览器,还可以通过.browser.version方式获取浏览器版本信息。
4-2检测浏览器是否属于W3C盒子模型
浏览器的盒子模型分为两类,一类为标准的w3c盒子模型,另一类为IE盒子模型,两者区别为在Width和Height这两个属性值中是否包含padding和border的值,w3c盒子模型不包含,IE盒子模型则包含,而在jQuery 中,可以通过$.support.boxModel
对象返回的值,检测浏览器是否属于标准的w3c盒子模型。
4-3检测对象是否为空
在jQuery中,可以调用名为.isEmptyObject的工具函数,检测一个对象的内容是否为空,如果为空,则该函数返回true,否则,返回false值,调用格式如下:.isEmptyObject(obj);
4-4检测对象是否为原始对象
调用名为.isPlainObject的工具函数,能检测对象是否为通过{}或new Object()关键字创建的原始对象,如果是,返回true,否则,返回false值,调用格式为:.isPlainObject (obj);
4-5检测两个节点的包含关系
调用名为.contains的工具函数,能检测在一个DOM节点中是否包含另外一个DOM节点,如果包含,返回true,否则,返回false值,调用格式为:.contains (container, contained);
参数container表示一个DOM对象节点元素,用于包含其他节点的容器,contained是另一个DOM对象节点元素,用于被其他容器所包含。
4-6字符串操作函数
调用名为.trim的工具函数,能删除字符串中左右两边的空格符,但该函数不能删除字符串中间的空格,调用格式为:.trim (str);
4-7URL操作函数
调用名为$. param
的工具函数,能使对象或数组按照key/value
格式进行序列化编码,该编码后的值常用于向服务端发送URL请求,调用格式为:
$.
param (obj);
参数obj表示需要进行序列化的对象,该对象也可以是一个数组,整个函数返回一个经过序列化编码后的字符串。
4-8使用$.extend()扩展工具函数
调用名为. extend的工具函数,可以对原有的工具函数进行扩展,自定义类级别的jQuery插件,调用格式为:. extend ({options});参数options表示自定义插件的函数内容。
例如,调用$.extend()
函数,自定义一个用于返回两个数中最大值的插件,并在页面中将插件返回的最大值显示在页面中,如下图所示:
4-9使用$.extend()扩展Object对象
除使用.extend扩展工具函数外,还可以扩展原有的Object对象,在扩展对象时,两个对象将进行合并,当存在相同属性名时,后者将覆盖前者,调用格式为:. extend (obj1,obj2,…objN);参数obj1至objN表示需要合并的各个原有对象。
例如,调用$.extend()
函数对两个已有的对象进行合并,,返回一个包含两个对象中全部属性元素的新对象,相同名称的“name”属性,前者被后者覆盖。
在列表<ul>元素中,鼠标在列表项<li>元素移动时,可以自定义其获取焦点(focus)时的背景颜色,即设置表项<li>元素选中时的背景色.
<html xmlns="https://www.w3.org/1999/xhtml">
<head>
<title></title>
<script src="https://libs.baidu.com/jquery/1.9.1/jquery.js"></script>
<style>
li {
background-color: yellow;
}
li:first-child {
background-color: blue;
}
</style>
</head>
<body>
<ul id="nav_ul">
<li>第1个LI</li>
<li>第2个LI</li>
<li>第3个LI</li>
</ul>
</body>
</html>
<script type="text/javascript">
//方法一 简单方便 但不推荐
(function ($) {
$.extend({
"focusColor": function (obj, color) {
var a = obj.css("backgroundColor");
obj.hover(function () {
$(this).css("backgroundColor", color);
$(this).siblings().css("backgroundColor", "");
}, function () {
$(this).css("backgroundColor", "");
})
}
});
})(jQuery);
$.focusColor($("li"), "red");
//方法二 封装一般是这样写
$(function () {
//注意此处each的原因是为了得到每个li原始颜色 注意 li:first-child样式
$("nav_ul li").each(function (index) {
$(this).focusColor2("red");
});
});
(function ($) {
$.fn.extend({
"focusColor2": function (color) {
var oldColor = $(this).css("backgroundColor");
$(this).hover(function () {
$(this).css("backgroundColor", color);
}, function () {
$(this).css("backgroundColor", oldColor);
})
}
});
})(jQuery);
</script>
相关文章
- Spring Boot集成JUnit5,优雅单元测试!
- 240多个jQuery插件
- Bootstrap视频教程下载
- 网页编辑开发工具软件Dreamweaver 2020版下载
- 【转】C#之读取web上的xml
- 博客园的HTTPS网站JS脚本访问问题
- 向搜索引擎提交网站
- 12、Eclipse 创建 XML 文件
- 2023-01-13:joxit/docker-registry-ui是registry的web界面工具之一。请问部署在k3s中,yaml如何写?
- vue3 函数式组件调试报警 Non-function value encountered for default slot
- 关于 Angular 开发时对主流浏览器支持的话题
- 了不起的回调函数
- 重磅!哈啰 Quark Design 正式开源,新一代跨技术栈前端组件库
- 36场面试,通过了33场...
- v-slot匿名插槽、具名插槽及作用域插槽
- JS数组常用方法大全
- vue-cli3构建H5移动应用(vant+rem)
- JS异步加载的三种方式
- Touch 移动设备上的 手势识别 与 Js事件库
- 「 [学习日记] vue的引入与简单使用 」