首页    技术博客    PHP教程    数据库技术    前端开发   HTML5    Nginx    php论坛
新用户注册 | 会员登录
加入会员，解锁专属内容
取消
热门标签 | HotTags
当前位置:  开发笔记 > 编程语言 > 正文

php解决vue图片预加载,图片预加载–前端开发，JQUERY特效，全栈开发，vue开发...

作者：丰日2012_102 | 来源：互联网 | 2023-09-16 16:47
一、未使用预加载技术前图片预加载之无序加载.box{text-align:center;}.btn{display:inline-block;height:30px;line-he

一、未使用预加载技术前

1997982363886da6f0cf107a5ae3fde5.gif

72102eefbc2103bf91f824daadde551b.gif

图片预加载之无序加载

.box {

text-align: center;

}

.btn {

display: inline-block;

height: 30px;

line-height: 30px;

border: 1px solid #ccc;

background: #fff;

padding: 0 10px;

margin-right: 50px;

color: #333;

}

a {

text-decoration: none;

}

.btn:hover {

background-color: #b5b5b5;

}

7077e8c6235f4e1b232a1ef5d25a2587.png

alt&＃61;"pic" id&＃61;"img" width&＃61;"900"/>

上一页

下一页

var imgs &＃61; [

"http://desk.fd.zol-img.com.cn/t_s960x600c5/g5/M00/0F/09/ChMkJlauzbOIb6JqABF4o12gc_AAAH9HgF1sh0AEXi7441.jpg",

"http://desk.fd.zol-img.com.cn/t_s960x600c5/g5/M00/0F/09/ChMkJ1auzbKIS8d1ABmgDYbGTm4AAH9HgDVQJkAGaAl653.jpg",

"http://desk.fd.zol-img.com.cn/t_s960x600c5/g5/M00/0F/09/ChMkJlauzbKIYXwYAA3k8MKqRbcAAH9HgDu4L4ADeUI140.jpg",

"http://desk.fd.zol-img.com.cn/t_s960x600c5/g5/M00/0F/09/ChMkJ1auzbKIHSPXABHf7cWFpNwAAH9HgD8xcYAEeAF788.png",

"http://desk.fd.zol-img.com.cn/t_s960x600c5/g5/M00/0F/09/ChMkJlauzbKIeIlZAAnxiXety0IAAH9HgEOpcsACfGh744.jpg",

"http://desk.fd.zol-img.com.cn/t_s960x600c5/g5/M00/0F/09/ChMkJ1auzbKIX4p4ABNtzPOq83gAAH9HgEYl2wAE23k650.jpg",

"http://desk.fd.zol-img.com.cn/t_s960x600c5/g5/M00/0F/09/ChMkJ1auzbKIdDRhABqMJC8YI_sAAH9HgEsBVAAGow8388.jpg",

"http://desk.fd.zol-img.com.cn/t_s960x600c5/g5/M00/0F/09/ChMkJlauzbOIF7dTABn5-3IG-s8AAH9HgFGkYwAGfoT769.jpg",

"http://desk.fd.zol-img.com.cn/t_s960x600c5/g5/M00/0F/09/ChMkJlauzbOIadTUABUmZqHccD0AAH9HgFgi58AFSZ-104.jpg",

"http://desk.fd.zol-img.com.cn/t_s960x600c5/g5/M00/08/0A/ChMkJ1i9XJmIJnFtABXosJGWaOkAAae8QGrHE8AFejI057.jpg"

];

var index &＃61; 0,

len &＃61; imgs.length;

$(&＃39;.btn&＃39;).on("click", function () {

if (&＃39;prev&＃39; &＃61;&＃61;&＃61; $(this).data(&＃39;control&＃39;)) {//上一张

index &＃61; Math.max(0, --index);

} else {//下一张

index &＃61; Math.min(len - 1, &＃43;&＃43;index);

}

document.title &＃61; (index &＃43; 1) &＃43; &＃39;/&＃39; &＃43; len;

$("#img").attr(&＃39;src&＃39;, imgs[index]);

})

二、使用图片的无序预加载技术

图片预加载之无序加载

html, body {

height: 100%;

}

.box {

text-align: center;

}

.btn {

display: inline-block;

height: 30px;

line-height: 30px;

border: 1px solid #ccc;

background: #fff;

padding: 0 10px;

margin-right: 50px;

color: #333;

}

a {

text-decoration: none;

}

.btn:hover {

background-color: #b5b5b5;

}

.loading {

position: fixed;

left: 0;

top: 0;

width: 100%;

height: 100%;

background-color: #eee;

text-align: center;

font-size: 30px;

font-weight: 700;

}

.progress {

margin-top: 300px;

}

0%

7077e8c6235f4e1b232a1ef5d25a2587.png

alt&＃61;"pic" id&＃61;"img" width&＃61;"900"/>

上一页

下一页

var imgs &＃61; [

"http://desk.fd.zol-img.com.cn/t_s960x600c5/g5/M00/0F/09/ChMkJlauzbOIb6JqABF4o12gc_AAAH9HgF1sh0AEXi7441.jpg",

"http://desk.fd.zol-img.com.cn/t_s960x600c5/g5/M00/0F/09/ChMkJ1auzbKIS8d1ABmgDYbGTm4AAH9HgDVQJkAGaAl653.jpg",

"http://desk.fd.zol-img.com.cn/t_s960x600c5/g5/M00/0F/09/ChMkJlauzbKIYXwYAA3k8MKqRbcAAH9HgDu4L4ADeUI140.jpg",

"http://desk.fd.zol-img.com.cn/t_s960x600c5/g5/M00/0F/09/ChMkJ1auzbKIHSPXABHf7cWFpNwAAH9HgD8xcYAEeAF788.png",

"http://desk.fd.zol-img.com.cn/t_s960x600c5/g5/M00/0F/09/ChMkJlauzbKIeIlZAAnxiXety0IAAH9HgEOpcsACfGh744.jpg",

"http://desk.fd.zol-img.com.cn/t_s960x600c5/g5/M00/0F/09/ChMkJ1auzbKIX4p4ABNtzPOq83gAAH9HgEYl2wAE23k650.jpg",

"http://desk.fd.zol-img.com.cn/t_s960x600c5/g5/M00/0F/09/ChMkJ1auzbKIdDRhABqMJC8YI_sAAH9HgEsBVAAGow8388.jpg",

"http://desk.fd.zol-img.com.cn/t_s960x600c5/g5/M00/0F/09/ChMkJlauzbOIF7dTABn5-3IG-s8AAH9HgFGkYwAGfoT769.jpg",

"http://desk.fd.zol-img.com.cn/t_s960x600c5/g5/M00/0F/09/ChMkJlauzbOIadTUABUmZqHccD0AAH9HgFgi58AFSZ-104.jpg",

"http://desk.fd.zol-img.com.cn/t_s960x600c5/g5/M00/08/0A/ChMkJ1i9XJmIJnFtABXosJGWaOkAAae8QGrHE8AFejI057.jpg"

];

/**

* 按钮点击响应

*/

var index &＃61; 0,

len &＃61; imgs.length,

count &＃61; 0,//记录加载了几张图片

$progress &＃61; $(".progress"),

$loading &＃61; $(".loading");

$(&＃39;.btn&＃39;).on("click", function () {

if (&＃39;prev&＃39; &＃61;&＃61;&＃61; $(this).data(&＃39;control&＃39;)) {//上一张

index &＃61; Math.max(0, --index);

} else {//下一张

index &＃61; Math.min(len - 1, &＃43;&＃43;index);

}

document.title &＃61; (index &＃43; 1) &＃43; &＃39;/&＃39; &＃43; len;

$("#img").attr(&＃39;src&＃39;, imgs[index]);

})

/*预加载遍历*/

/*注意这里用count计算来判断图片是否加载完&＃xff0c;而不用i变量&＃xff0c;因为每张图片加载完成时间不一样*/

$.each(imgs, function (i, item) {

var imgObj &＃61; new Image();

$(imgObj).on("load error", function () { //图片没有正常加载页可以正确处理

//每加载完一张图片需要做的处理

count&＃43;&＃43;;

$progress.html(Math.round(count / len) * 100 &＃43; "%");//Math.round四舍五入转为整数

console.log(count);

//图片全部加载完需要做的处理

if (count >&＃61; len) {

$loading.hide();

document.title &＃61; &＃39;1/&＃39; &＃43; len; //表示当前是第一张

}

});

$(imgObj).attr("src", item);

})

三、把无序预加载写成jQuery插件

写成插件让其具备复用性

preload.js

1997982363886da6f0cf107a5ae3fde5.gif

72102eefbc2103bf91f824daadde551b.gif

/**

* Created by xiaoyanliu on 2017/5/17.

*/

/**

* 图片预加载

*/

(function ($) {

/**

* 用OOP的构造函数来写

* &＃64;constructor

*/

function Preload(imgs, options) {

/*第一步&＃xff1a;初始化*/

this.imgs &＃61; (typeof imgs &＃61;&＃61;&＃61; "string") ? [imgs] : imgs;//如果有一张图片可以传入字符串&＃xff0c;将它包装成数组

/*opts是传入的options和默认值DEFAULTS的融合&＃xff0c;若传入使用传入的值&＃xff0c;没有传入使用默认值*/

/*将后一个覆盖前一个的内容&＃xff0c;形成一个新的对象&＃xff0c;将新对象返回给this.opts保存下来*/

this.opts &＃61; $.extend({}, Preload.DEFAULTS, options);

/*第二步&＃xff1a;执行无序加载的方法*/

this._unordered();//这个方法只在内部使用&＃xff0c;不在外部调用

}

/*默认参数*/

Preload.DEFAULTS &＃61; {

each: null,//每一张图片加载完毕后执行

all: null//全部图片加载完毕后执行

}

/*第三步&＃xff1a;写方法*/

/**

* 方法都写在原型上&＃xff0c;这样多次多次实例化可以共用一份

*/

Preload.prototype._unordered &＃61; function () {//无序加载

console.log("调用无序加载");

var imgs &＃61; this.imgs,

opts &＃61; this.opts,

count &＃61; 0,

len &＃61; imgs.length;

/*预加载遍历*/

/*注意这里用count计算来判断图片是否加载完&＃xff0c;而不用i变量&＃xff0c;因为每张图片加载完成时间不一样*/

$.each(imgs, function (i, item) {

if (typeof item !&＃61; &＃39;string&＃39;) return;//图片地址不是字符串&＃xff0c;就不处理

var imgObj &＃61; new Image();

$(imgObj).on("load error", function () { //图片没有正常加载页可以正确处理

//每加载完一张图片需要做的处理

count&＃43;&＃43;;

opts.each && opts.each(count);

//图片全部加载完需要做的处理

if (count >&＃61; len) {

opts.all && opts.all();

}

});

$(imgObj).attr("src", item);

})

}

$.extend({

preload: function (imgs, opts) {

new Preload(imgs, opts);

}

});

})(jQuery);

调用插件实现功能&＃xff1a;

/*调用插件实现预加载*/

$.preload(imgs, {

each: function (count) {

$progress.html(Math.round(count / len) * 100 &＃43; "%");//Math.round四舍五入转为整数

},

all: function () {

$loading.hide();

document.title &＃61; &＃39;1/&＃39; &＃43; len; //表示当前是第一张

}

});

完整html

1997982363886da6f0cf107a5ae3fde5.gif

72102eefbc2103bf91f824daadde551b.gif

图片预加载之无序加载

html, body {

height: 100%;

}

.box {

text-align: center;

}

.btn {

display: inline-block;

height: 30px;

line-height: 30px;

border: 1px solid #ccc;

background: #fff;

padding: 0 10px;

margin-right: 50px;

color: #333;

}

a {

text-decoration: none;

}

.btn:hover {

background-color: #b5b5b5;

}

.loading {

position: fixed;

left: 0;

top: 0;

width: 100%;

height: 100%;

background-color: #eee;

text-align: center;

font-size: 30px;

font-weight: 700;

}

.progress {

margin-top: 300px;

}

0%

7077e8c6235f4e1b232a1ef5d25a2587.png

alt&＃61;"pic" id&＃61;"img" width&＃61;"900"/>

上一页

下一页

var imgs &＃61; [

"http://desk.fd.zol-img.com.cn/t_s960x600c5/g5/M00/0F/09/ChMkJlauzbOIb6JqABF4o12gc_AAAH9HgF1sh0AEXi7441.jpg",

"http://desk.fd.zol-img.com.cn/t_s960x600c5/g5/M00/0F/09/ChMkJ1auzbKIS8d1ABmgDYbGTm4AAH9HgDVQJkAGaAl653.jpg",

"http://desk.fd.zol-img.com.cn/t_s960x600c5/g5/M00/0F/09/ChMkJlauzbKIYXwYAA3k8MKqRbcAAH9HgDu4L4ADeUI140.jpg",

"http://desk.fd.zol-img.com.cn/t_s960x600c5/g5/M00/0F/09/ChMkJ1auzbKIHSPXABHf7cWFpNwAAH9HgD8xcYAEeAF788.png",

"http://desk.fd.zol-img.com.cn/t_s960x600c5/g5/M00/0F/09/ChMkJlauzbKIeIlZAAnxiXety0IAAH9HgEOpcsACfGh744.jpg",

"http://desk.fd.zol-img.com.cn/t_s960x600c5/g5/M00/0F/09/ChMkJ1auzbKIX4p4ABNtzPOq83gAAH9HgEYl2wAE23k650.jpg",

"http://desk.fd.zol-img.com.cn/t_s960x600c5/g5/M00/0F/09/ChMkJ1auzbKIdDRhABqMJC8YI_sAAH9HgEsBVAAGow8388.jpg",

"http://desk.fd.zol-img.com.cn/t_s960x600c5/g5/M00/0F/09/ChMkJlauzbOIF7dTABn5-3IG-s8AAH9HgFGkYwAGfoT769.jpg",

"http://desk.fd.zol-img.com.cn/t_s960x600c5/g5/M00/0F/09/ChMkJlauzbOIadTUABUmZqHccD0AAH9HgFgi58AFSZ-104.jpg",

"http://desk.fd.zol-img.com.cn/t_s960x600c5/g5/M00/08/0A/ChMkJ1i9XJmIJnFtABXosJGWaOkAAae8QGrHE8AFejI057.jpg"

];

/**

* 按钮点击响应

*/

var index &＃61; 0,

len &＃61; imgs.length,

count &＃61; 0,//记录加载了几张图片

$progress &＃61; $(".progress"),

$loading &＃61; $(".loading");

$(&＃39;.btn&＃39;).on("click", function () {

if (&＃39;prev&＃39; &＃61;&＃61;&＃61; $(this).data(&＃39;control&＃39;)) {//上一张

index &＃61; Math.max(0, --index);

} else {//下一张

index &＃61; Math.min(len - 1, &＃43;&＃43;index);

}

document.title &＃61; (index &＃43; 1) &＃43; &＃39;/&＃39; &＃43; len;

$("#img").attr(&＃39;src&＃39;, imgs[index]);

})

/*调用插件实现预加载*/

$.preload(imgs, {

each: function (count) {

$progress.html(Math.round(count / len) * 100 &＃43; "%");//Math.round四舍五入转为整数

},

all: function () {

$loading.hide();

document.title &＃61; &＃39;1/&＃39; &＃43; len; //表示当前是第一张

}

});

四、有序加载

1997982363886da6f0cf107a5ae3fde5.gif

72102eefbc2103bf91f824daadde551b.gif

图片预加载之有序加载

body {

background-color: #eee;

}

.box {

text-align: center;

}

.btn {

display: inline-block;

height: 30px;

line-height: 30px;

border: 1px solid #ccc;

background: #fff;

padding: 0 10px;

margin-right: 50px;

color: #333;

}

a {

text-decoration: none;

}

.btn:hover {

background-color: #b5b5b5;

}

pic

上一页

下一页

/*技巧*/

var imgs &＃61; [];

for (var i &＃61; 0; i <6; i&＃43;&＃43;) {

imgs[i] &＃61; &＃39;images/order/&＃39; &＃43; (i &＃43; 1) &＃43; &＃39;.jpg&＃39;;

}

/**

* 按钮点击响应

*/

var len &＃61; imgs.length,

index &＃61; 0,//按钮点击当前第几张

count &＃61; 0;//记录加载了几张图片

/*递归实现有序加载*/

function load() {

var imgObj &＃61; new Image();

$(imgObj).on("load error", function () {

if (count >&＃61; len) {

//所有图片已经加载完毕

} else {

load();

count&＃43;&＃43;;

}

});

imgObj.src &＃61; imgs[count];

}

;

load();

$(&＃39;.btn&＃39;).on("click", function () {

if (&＃39;prev&＃39; &＃61;&＃61;&＃61; $(this).data(&＃39;control&＃39;)) {//上一张

index &＃61; Math.max(0, --index);

} else {//下一张

index &＃61; Math.min(len - 1, &＃43;&＃43;index);

}

document.title &＃61; (index &＃43; 1) &＃43; &＃39;/&＃39; &＃43; len;

$("#img").attr(&＃39;src&＃39;, imgs[index]);

})

9f9ea9734272adec74d1fb488437cd3c.png

五、将有序加载加入到插件中

最终包含了有序加载和无序加载的插件

/**

* Created by xiaoyanliu on 2017/5/17.

*/

/**

* 图片预加载

*/

(function ($) {

/**

* 用OOP的构造函数来写

* &＃64;constructor

*/

function Preload(imgs, options) {

/*第一步&＃xff1a;初始化*/

this.imgs &＃61; (typeof imgs &＃61;&＃61;&＃61; "string") ? [imgs] : imgs;//如果有一张图片可以传入字符串&＃xff0c;将它包装成数组

/*opts是传入的options和默认值DEFAULTS的融合&＃xff0c;若传入使用传入的值&＃xff0c;没有传入使用默认值*/

/*将后一个覆盖前一个的内容&＃xff0c;形成一个新的对象&＃xff0c;将新对象返回给this.opts保存下来*/

this.opts &＃61; $.extend({}, Preload.DEFAULTS, options);

/*第二步&＃xff1a;通过判断执行无序加载的方法*/

if (this.opts.order &＃61;&＃61;&＃61; "ordered") {//执行有序预加载

this._ordered();

} else {

this._unordered();//这个方法只在内部使用&＃xff0c;不在外部调用

}

}

/*默认参数*/

Preload.DEFAULTS &＃61; {

order: &＃39;unordered&＃39;,//默认情况使用无序加载

each: null,//每一张图片加载完毕后执行

all: null//全部图片加载完毕后执行

}

/*第三步&＃xff1a;写方法*/

/**

* 方法都写在原型上&＃xff0c;这样多次多次实例化可以共用一份

*/

Preload.prototype._ordered &＃61; function () {//有序预加载

var imgs &＃61; this.imgs,

opts &＃61; this.opts,

count &＃61; 0,

len &＃61; imgs.length;

load();

/*递归实现有序加载*/

function load() {

var imgObj &＃61; new Image();

$(imgObj).on("load error", function () {

opts.each && opts.each(count);

if (count >&＃61; len) {

//所有图片已经加载完毕

opts.all && opts.all();

} else {

load();

count&＃43;&＃43;;

}

});

imgObj.src &＃61; imgs[count];

};

},

Preload.prototype._unordered &＃61; function () {//无序加载

console.log("调用无序加载");

var imgs &＃61; this.imgs,

opts &＃61; this.opts,

count &＃61; 0,

len &＃61; imgs.length;

/*预加载遍历*/

/*注意这里用count计算来判断图片是否加载完&＃xff0c;而不用i变量&＃xff0c;因为每张图片加载完成时间不一样*/

$.each(imgs, function (i, item) {

if (typeof item !&＃61; &＃39;string&＃39;) return;//图片地址不是字符串&＃xff0c;就不处理

var imgObj &＃61; new Image();

$(imgObj).on("load error", function () { //图片没有正常加载页可以正确处理

//每加载完一张图片需要做的处理

count&＃43;&＃43;;

opts.each && opts.each(count);

//图片全部加载完需要做的处理

if (count >&＃61; len) {

opts.all && opts.all();

}

});

$(imgObj).attr("src", item);

})

}

$.extend({

preload: function (imgs, opts) {

new Preload(imgs, opts);

}

});

})(jQuery);

调用有序加载

/*使用插件*/

$.preload(imgs,{

order:&＃39;ordered&＃39;

});

本文作者starof,因知识本身在变化&＃xff0c;作者也在不断学习成长&＃xff0c;文章内容也不定时更新&＃xff0c;为避免误导读者&＃xff0c;方便追根溯源&＃xff0c;请诸位转载注明出处&＃xff1a;http://www.cnblogs.com/starof/p/6866523.html有问题欢迎与我讨论&＃xff0c;共同进步。

作者&＃xff1a;starof



推荐阅读
  • get

    VueCLI多页分目录打包的步骤记录

    VueCLI多页分目录打包的步骤记录
    本文介绍了使用VueCLI进行多页分目录打包的步骤，包括页面目录结构、安装依赖、获取Vue CLI需要的多页对象等内容。同时还提供了自定义不同模块页面标题的方法。 ... [详细]
  • utf-8

    用Vue实现的Demo商品管理效果图及实现代码

    用Vue实现的Demo商品管理效果图及实现代码
    本文介绍了一个使用Vue实现的Demo商品管理的效果图及实现代码。 ... [详细]
  • utf-8

    1 Vue基础

    Vue基础一、什么是Vue1.1概念Vue(读音vjuː，类似于view)是一套用于构建用户界面的渐进式JavaScript框架，与其它大型框架不 ... [详细]
  • utf-8

    Vue案例（搜索页面）

    <!DOCTYPEhtml><htmllang=en><head><metacharset=UT ... [详细]
  • utf-8

    web前端工程化之数据绑定

    web前端工程化之数据绑定
    这篇博客我放了好久都没有来补充了，是因为那时候做前端，有很多东西很迷糊，这些名词都是新的，经过这么长时间的沉淀， ... [详细]
  • utf-8

    使用HTML创建弹出框以便用户输入信息

    使用HTML创建弹出框以便用户输入信息
    在做项目的过程中，我们时常需要进行一些弹框操作，比如在后台管理时需要进行的一些增删改操作，这个时候我们需要使用到弹框，或者在 ... [详细]
  • 数组

    Webpack5内置处理图片资源的配置方法

    Webpack5内置处理图片资源的配置方法
    本文介绍了在Webpack5中处理图片资源的配置方法。在Webpack4中，我们需要使用file-loader和url-loader来处理图片资源，但是在Webpack5中，这两个Loader的功能已经被内置到Webpack中，我们只需要简单配置即可实现图片资源的处理。本文还介绍了一些常用的配置方法，如匹配不同类型的图片文件、设置输出路径等。通过本文的学习，读者可以快速掌握Webpack5处理图片资源的方法。 ... [详细]
  • get

    Hibernate基础映射

    在说Hibernate映射前，我们先来了解下对象关系映射ORM。ORM的实现思想就是将关系数据库中表的数据映射成对象，以对象的形式展现。这样开发人员就可以把对数据库的操作转化为对 ... [详细]
  • php

    手机移动端HTML5和JavaScript如何实现视频上传和压缩视频质量？

    本文讨论了在手机移动端如何使用HTML5和JavaScript实现视频上传并压缩视频质量，或者降低手机摄像头拍摄质量的问题。作者指出HTML5和JavaScript无法直接压缩视频，只能通过将视频传送到服务器端由后端进行压缩。对于控制相机拍摄质量，只有使用JAVA编写Android客户端才能实现压缩。此外，作者还解释了在交作业时使用zip格式压缩包导致CSS文件和图片音乐丢失的原因，并提供了解决方法。最后，作者还介绍了一个用于处理图片的类，可以实现图片剪裁处理和生成缩略图的功能。 ... [详细]
  • get

    Express App如何提供不需要的静态文件？

    本文介绍了如何使用Express App提供静态文件，同时提到了一些不需要使用的文件，如package.json和/.ssh/known_hosts，并解释了为什么app.get('*')无法捕获所有请求以及为什么app.use(express.static(__dirname))可能会提供不需要的文件。 ... [详细]
  • nodejs

    webpack vue 构建的项目，npm run build后 路径问题

    npmrunbuild后dist文件夹下面直接浏览器打开index.html，css和js的路径都不正确。放到跟目录下就正常了，iis上同样只能在根目录下。我项目的目录如下： ... [详细]
  • get

    PL/SQL Developer使用技巧(转)

    1、PLSQLDeveloper记住登陆密码在使用PLSQLDeveloper时，为了工作方便希望PLSQLDeveloper记住登录Oracle的用户名和密码&#x ... [详细]
  • object

    面试默认参数(传值)、var(传址)、out(输出)、const(常数)

    相关资料：1.http:blog.csdn.netrznicearticledetails69600112.http:www.cnblogs.comechomyech ... [详细]
  • 数组

    二十二、D3 饼图

    二十二、D3饼图Abstract在前一章中，你已经看到了条形图是如何表示某一类数 ... [详细]
  • 数组

    用jQuery做定位元素，做自动化测试你尝试过吗

    一、前言元素定位可以说是学自动化测试中必会技能之一，也可以说是通往自动化之路的开门钥匙。就元素定位方法，除了我们常用并熟知的8种元素定位方法之外，还有一种定位方法可以说是一种特殊的 ... [详细]
author-avatar
丰日2012_102
这个家伙很懒，什么也没留下！
Tags | 热门标签
RankList | 热门文章
PHP1.CN | 中国最专业的PHP中文社区 | DevBox开发工具箱 | json解析格式化 |PHP资讯 | PHP教程 | 数据库技术 | 服务器技术 | 前端开发技术 | PHP框架 | 开发工具 | 在线工具
Copyright © 1998 - 2020 PHP1.CN. All Rights Reserved | 京公网安备 11010802041100号 | 京ICP备19059560号-4 | PHP1.CN 第一PHP社区 版权所有