js图片实时加载

浏览大型网站，特别是图片比较多的图片，如大型的电商网站，你会发现处了第一屏外，往下滚动的时候图片才加载出来，没必要一开始加载就要把全部图片加载出来，这样子打开网面的速度得到了很好提高。以下是笔者目前所想到的思路，如果有更好的思路，望不吝赐教。

其实实时加载图片思路很简单，页面一开始加载的时候把不需要一开始就加载的图片（如第二屏以下的图片，反正是要往下滚动才能看到的，不如把它们设置成往下滚动的时候再实时加载）路径保持到一个自定义的属性里，如：<img class="aimg" src="http://ctc.qzonestyle.gtimg.cn/ac/b.gif" data-src="http://y3.ifengimg.com/a/2014_37/03c4830691a6d8b.jpg" />，src="http://ctc.qzonestyle.gtimg.cn/ac/b.gif"是一个1px*1px的透明gif图片，自定义属性data-src里的"http://y3.ifengimg.com/a/2014_37/03c4830691a6d8b.jpg"才是图片的路径，往下滚动到它的时候把data-src里的值替换掉src的值，然后把data-src属性移除掉……

如下是demo

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

<html xmlns="http://www.w3.org/1999/xhtml">

<head>

<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />

<title>js图片实时加载</title>

<style>

*{padding:0; margin:0;}

.wp{width:1000px; margin:5px auto; padding:10px 0; border-bottom:1px solid #dedede; overflow:hidden;}

ul li{ display:block; width:250px; float:left; margin:5px 0; list-style:none;}

.aimg{ display:block; height:300px; max-width:348px; border:1px solid #EEE; background:url(http://ctc.qzs.qq.com/aoi/img/icenter/loading.gif) no-repeat center center;}

</style>

</head>

<body>

<div class="wp">

    <a href="http://www.cnblogs.com/xiaomou2014"><img src="http://pic.cnitblog.com/avatar/356740/20140716231521.png" alt="xiaomou2014的头像"></a>

    <a href="http://www.cnblogs.com/xiaomou2014">http://www.cnblogs.com/xiaomou2014</a>

    cont2开始的图片是实时加载的

</div>

<div class="cont1 wp">

    <h2>cont1</h2>

    <ul>

        <li><a href="http://news.ifeng.com/a/20140909/41906442_0.shtml#p=1" target="_blank" ><img class="aimg" src="http://e.hiphotos.baidu.com/image/w%3D310/sign=e0e3bb2e38292df597c3aa148c315ce2/c83d70cf3bc79f3d8cd19a31b8a1cd11728b29fa.jpg"  /></a></li>

        <li><img class="aimg" src="http://h.hiphotos.baidu.com/image/w%3D310/sign=19bbb515ff1f4134e037037f151e95c1/b7fd5266d016092414bd8aedd60735fae7cd34af.jpg" /></li>

        <li><img class="aimg" src="http://g.hiphotos.baidu.com/image/w%3D310/sign=dbbeb83d4b540923aa69657fa258d1dc/b812c8fcc3cec3fdaa0ce16bd488d43f879427f9.jpg" /></li>

        <li><img class="aimg" src="http://c.hiphotos.baidu.com/image/w%3D310/sign=8e78cf5936a85edffa8cf822795409d8/bba1cd11728b47108b5b5bc5c1cec3fdfc032346.jpg" /></li>

        <li><img class="aimg" src="http://e.hiphotos.baidu.com/image/w%3D310/sign=75538617df54564ee565e23883de9cde/c2cec3fdfc039245ea8f5b0b8594a4c27d1e25ff.jpg" /></li>

        <li><img class="aimg" src="http://d.hiphotos.baidu.com/image/w%3D310/sign=4e7eef2892ef76c6d0d2fd2aad17fdf6/a9d3fd1f4134970a9bed2d2697cad1c8a7865d18.jpg" /></li>

        <li><img class="aimg" src="http://a.hiphotos.baidu.com/image/w%3D310/sign=22e5b431bc096b63811958513c328733/ac345982b2b7d0a224577783c9ef76094b369a15.jpg" /></li>

        <li><img class="aimg" src="http://g.hiphotos.baidu.com/image/w%3D310/sign=d76eb55fb33533faf5b6952f98d2fdca/ac6eddc451da81cbf76dbf9c5066d016082431d3.jpg" /></li>

        <li><img class="aimg" src="http://f.hiphotos.baidu.com/image/w%3D310/sign=7f41436edbf9d72a1764161ce42a282a/adaf2edda3cc7cd9e81d13883b01213fb80e91aa.jpg" /></li>

        <li><img class="aimg" src="http://b.hiphotos.baidu.com/image/w%3D310/sign=d1e3fa4567380cd7e61ea4ec9145ad14/ae51f3deb48f8c54f573c0da38292df5e1fe7fa6.jpg" /></li>

        <li><img class="aimg" src="http://e.hiphotos.baidu.com/image/w%3D310/sign=03c6a3c737fae6cd0cb4ad603fb10f9e/b151f8198618367a4e593d2d2c738bd4b21ce56a.jpg" /></li>

        <li><img class="aimg" src="http://a.hiphotos.baidu.com/image/w%3D310/sign=2c2009a6d01b0ef46ce89e5fedc651a1/b219ebc4b74543a90ac4bb441c178a82b801145e.jpg" /></li>

    </ul>

</div>

<div class="cont2 wp">

    <h2>cont2</h2>

    <ul>

        <li><a href="http://news.ifeng.com/a/20140909/41906442_0.shtml#p=1" target="_blank" ><img class="aimg" src="http://ctc.qzonestyle.gtimg.cn/ac/b.gif" data-src="http://y3.ifengimg.com/a/2014_37/03c4830691a6d8b.jpg"  /></a></li>

        <li><a href="http://news.ifeng.com/a/20140909/41906442_0.shtml#p=1" target="_blank" ><img class="aimg" src="http://ctc.qzonestyle.gtimg.cn/ac/b.gif" data-src="http://y2.ifengimg.com/a/2014_37/89ed5c7eff33abf.jpg" /></a></li>

        <li><a href="http://news.ifeng.com/a/20140909/41906442_0.shtml#p=1" target="_blank" ><img class="aimg" src="http://ctc.qzonestyle.gtimg.cn/ac/b.gif" data-src="http://y2.ifengimg.com/a/2014_37/d4dbca6004ab9b7.jpg" /></a></li>

        <li><a href="http://news.ifeng.com/a/20140909/41906442_0.shtml#p=1" target="_blank" ><img class="aimg" src="http://ctc.qzonestyle.gtimg.cn/ac/b.gif" data-src="http://y3.ifengimg.com/a/2014_37/9349a4b2ee90309.jpg" /></a></li>

        <li><a href="http://news.ifeng.com/a/20140909/41906442_0.shtml#p=1" target="_blank" ><img class="aimg" src="http://ctc.qzonestyle.gtimg.cn/ac/b.gif" data-src="http://y2.ifengimg.com/a/2014_37/b2491836e230932.jpg" /></a></li>

        <li><img class="aimg" src="http://ctc.qzonestyle.gtimg.cn/ac/b.gif" data-src="http://e.hiphotos.baidu.com/image/w%3D310/sign=655bcf71d31373f0f53f699e940f4b8b/86d6277f9e2f07089c207d0aeb24b899a901f297.jpg" /></li>

        <li><img class="aimg" src="http://ctc.qzonestyle.gtimg.cn/ac/b.gif" data-src="http://d.hiphotos.baidu.com/image/w%3D310/sign=3629f39bad51f3dec3b2bf65a4eff0ec/94cad1c8a786c917d4016968cb3d70cf3bc75764.jpg" /></li>

        <li><img class="aimg" src="http://ctc.qzonestyle.gtimg.cn/ac/b.gif" data-src="http://f.hiphotos.baidu.com/image/w%3D310/sign=8c009502257f9e2f70351b092f31e962/9922720e0cf3d7ca56401892f01fbe096a63a99b.jpg" /></li>

        <li><img class="aimg" src="http://ctc.qzonestyle.gtimg.cn/ac/b.gif" data-src="http://a.hiphotos.baidu.com/image/w%3D310/sign=f62f43b6ab773912c4268360c8198675/a1ec08fa513d269759c20d5657fbb2fb4316d8a3.jpg" /></li>

        <li><img class="aimg" src="http://ctc.qzonestyle.gtimg.cn/ac/b.gif" data-src="http://e.hiphotos.baidu.com/image/w%3D310/sign=9ce0b545a918972ba33a06cbd6cc7b9d/a8773912b31bb051b4ef3a79347adab44bede09c.jpg" /></li>

        <li><img class="aimg" src="http://ctc.qzonestyle.gtimg.cn/ac/b.gif" data-src="http://a.hiphotos.baidu.com/image/w%3D310/sign=9d833f1b950a304e5222a6fbe1c9a7c3/d1160924ab18972bb49b4bd5e4cd7b899e510a0f.jpg" /></li>

        <li><img class="aimg" src="http://ctc.qzonestyle.gtimg.cn/ac/b.gif" data-src="http://a.hiphotos.baidu.com/image/w%3D310/sign=4a93da2a552c11dfded1b92253266255/d62a6059252dd42a007e1c62013b5bb5c8eab887.jpg" /></li>

    </ul>

</div>

<div class="cont3 wp">

    <h2>cont3</h2>

    <ul>

        <li><img class="aimg" src="http://ctc.qzonestyle.gtimg.cn/ac/b.gif" data-src="http://h.hiphotos.baidu.com/image/w%3D310/sign=71556df3d2160924dc25a41ae406359b/f703738da977391274b38fc4fa198618377ae2fa.jpg" /></li>

        <li><img class="aimg" src="http://ctc.qzonestyle.gtimg.cn/ac/b.gif" data-src="http://d.hiphotos.baidu.com/image/w%3D310/sign=53e69395b8a1cd1105b674218913c8b0/ac4bd11373f08202f195e69a49fbfbedab641b0b.jpg" /></li>

        <li><img class="aimg" src="http://ctc.qzonestyle.gtimg.cn/ac/b.gif" data-src="http://h.hiphotos.baidu.com/image/w%3D310/sign=3749c38a4334970a4773162ea5cbd1c0/5366d0160924ab1808b1ea9237fae6cd7a890beb.jpg" /></li>

        <li><img class="aimg" src="http://ctc.qzonestyle.gtimg.cn/ac/b.gif" data-src="http://e.hiphotos.baidu.com/image/w%3D310/sign=8563bf5757fbb2fb342b5e137f4b2043/3b87e950352ac65cccb5d179f9f2b21193138a0c.jpg" /></li>

        <li><img class="aimg" src="http://ctc.qzonestyle.gtimg.cn/ac/b.gif" data-src="http://f.hiphotos.baidu.com/image/w%3D310/sign=74856b065e6034a829e2be80fb1249d9/d000baa1cd11728baab06e25cafcc3cec3fd2c1c.jpg" /></li>

        <li><img class="aimg" src="http://ctc.qzonestyle.gtimg.cn/ac/b.gif" data-src="http://c.hiphotos.baidu.com/image/w%3D310/sign=49e22cda34d12f2ece05a8617fc2d5ff/cdbf6c81800a19d88e30c90831fa828ba61e468f.jpg" /></li>

        <li><img class="aimg" src="http://ctc.qzonestyle.gtimg.cn/ac/b.gif" data-src="http://d.hiphotos.baidu.com/image/w%3D310/sign=539b0d21347adab43dd01d42bbd5b36b/54fbb2fb43166d22e4c8ab9d442309f79052d278.jpg" /></li>

        <li><img class="aimg" src="http://ctc.qzonestyle.gtimg.cn/ac/b.gif" data-src="http://b.hiphotos.baidu.com/image/w%3D310/sign=5077c2c2c1cec3fd8b3ea174e689d4b6/4afbfbedab64034f9195fd08adc379310a551d67.jpg" /></li>

        <li><img class="aimg" src="http://ctc.qzonestyle.gtimg.cn/ac/b.gif" data-src="http://a.hiphotos.baidu.com/image/w%3D310/sign=50bdad348418367aad8979dc1e728b68/3c6d55fbb2fb43168dce1a6722a4462308f7d3de.jpg" /></li>

        <li><img class="aimg" src="http://ctc.qzonestyle.gtimg.cn/ac/b.gif" data-src="http://b.hiphotos.baidu.com/image/w%3D310/sign=f3ef9fa4e9c4b7453494b117fffd1e78/0bd162d9f2d3572ce86585518813632763d0c3bc.jpg" /></li>

        <li><img class="aimg" src="http://ctc.qzonestyle.gtimg.cn/ac/b.gif" data-src="http://a.hiphotos.baidu.com/image/w%3D310/sign=30a6338deb24b899de3c7f395e071d59/0b46f21fbe096b63eeba47dd0e338744eaf8ac9f.jpg" /></li>

        <li><img class="aimg" src="http://ctc.qzonestyle.gtimg.cn/ac/b.gif" data-src="http://g.hiphotos.baidu.com/image/w%3D310/sign=75a14ae060d9f2d3201122ee99ec8a53/500fd9f9d72a60592b78941b2a34349b033bba42.jpg" /></li>

    </ul>

</div>

<script>

//兼容IE对getElementsByClassName

if (navigator.appName == 'Microsoft Internet Explorer') {

    document.getElementsByClassName = function() {

        var tTagName = "*";

        if (arguments.length > 1) {

            tTagName = arguments[1];

        }

        if (arguments.length > 2) {

            var pObj = arguments[2]

        } else {

            var pObj = document;

        }

        var objArr = pObj.getElementsByTagName(tTagName);

        var tRObj = new Array();

        for ( var i = 0; i < objArr.length; i++) {

            if (objArr[i].className == arguments[0]) {

                tRObj.push(objArr[i]);

            }

        }

        return tRObj;

    }

}

//图片加载

function loadImg(imgClass,imgSrc){

    //data-src:存放需要加载的图片的路径

    var arrImg=document.getElementsByClassName(imgClass); //需要实时加载class为imgClass的图片数组

    window.onscroll=function(){

        for(var i=0; i<arrImg.length; i++){

            if(!arrImg[i].getAttribute(imgSrc)) continue;

            if(document.documentElement.scrollTop+document.body.scrollTop+document.documentElement.clientHeight >arrImg[i].offsetTop){

                arrImg[i].setAttribute("src",arrImg[i].getAttribute(imgSrc));

                arrImg[i].removeAttribute(imgSrc);

            }

        }

    }

}

loadImg("aimg","data-src");

</script>

</body>

</html>

如上demo里的cont1里的图片是一加载页面就显示的，对于首页布局是固定的，可以确认那些图片是第二屏以下的，但是对于内容页，主体内容容器里的图片出现的位置是不可控制的，这就需要加载完毕真个页面的时候再判断是不是在在可视范围内，如果是在可视范围内就把它加载出来（当然，首页也可这么做，但是如果网速很慢，那么打开首页的时候要等到整个页面架构加载完毕之后才显示图片，而不是从上而下加载出来），图片要设置width与height属性，这让它在页面占一个位置，不然为加载前它只占透明gif图片的大小位置。

如下demo针对内容页做了一点修改，window.onload、window.onscroll的时候都触发加载

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

<html xmlns="http://www.w3.org/1999/xhtml">

<head>

<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />

<title>js图片实时加载</title>

<style>

*{padding:0; margin:0;}

.wp{width:1000px; margin:5px auto; padding:10px 0; border-bottom:1px solid #dedede; overflow:hidden;}

.fl{width:700px; padding:25px; float:left; border:1px solid #dedede; line-height:40px; overflow:hidden;}

.fr{width:220px; height:800px; float:right; background-color:#dedede;}

.aimg{ display:block; max-width:700px; margin:0 auto; background:url(http://ctc.qzs.qq.com/aoi/img/icenter/loading.gif) no-repeat center center;}

</style>

</head>

<body>

<div class="wp">

    <a href="http://www.cnblogs.com/xiaomou2014"><img src="http://pic.cnitblog.com/avatar/356740/20140716231521.png" alt="xiaomou2014的头像"></a>

    <a href="http://www.cnblogs.com/xiaomou2014">http://www.cnblogs.com/xiaomou2014</a>

</div>

<div class="wp">

    <div class="fl">

        <h2>7年前截肢的19岁癌症晚期女孩</h2>

        <p>http://www.cnblogs.com/xiaomou2014</p>

        <img class="aimg" src="http://ctc.qzonestyle.gtimg.cn/ac/b.gif" data-src="http://b.hiphotos.baidu.com/image/w%3D310/sign=f3ef9fa4e9c4b7453494b117fffd1e78/0bd162d9f2d3572ce86585518813632763d0c3bc.jpg" width="310" height="428"  />

        <p>http://www.cnblogs.com/xiaomou2014</p>

        <img class="aimg" src="http://ctc.qzonestyle.gtimg.cn/ac/b.gif" data-src="http://a.hiphotos.baidu.com/image/w%3D310/sign=30a6338deb24b899de3c7f395e071d59/0b46f21fbe096b63eeba47dd0e338744eaf8ac9f.jpg" width="310" height="419"  />

         <p>http://www.cnblogs.com/xiaomou2014</p>

       <img class="aimg" src="http://ctc.qzonestyle.gtimg.cn/ac/b.gif" data-src="http://g.hiphotos.baidu.com/image/w%3D310/sign=75a14ae060d9f2d3201122ee99ec8a53/500fd9f9d72a60592b78941b2a34349b033bba42.jpg" width="310" height="428"  />

        <p>7年前截肢的19岁癌症晚期女孩</p>

        <a href="http://news.ifeng.com/a/20140909/41906442_0.shtml#p=1"  target="_blank" ><img class="aimg" src="http://ctc.qzonestyle.gtimg.cn/ac/b.gif" data-src="http://y3.ifengimg.com/a/2014_37/03c4830691a6d8b.jpg"  width="640" height="480" /></a>

        <p>7年前截肢的19岁癌症晚期女孩</p>

        <a href="http://news.ifeng.com/a/20140909/41906442_0.shtml#p=1"  target="_blank" ><img class="aimg" src="http://ctc.qzonestyle.gtimg.cn/ac/b.gif" data-src="http://y2.ifengimg.com/a/2014_37/89ed5c7eff33abf.jpg" width="640" height="872" /></a>

        <p>7年前截肢的19岁癌症晚期女孩</p>

        <a href="http://news.ifeng.com/a/20140909/41906442_0.shtml#p=1"  target="_blank" ><img class="aimg" src="http://ctc.qzonestyle.gtimg.cn/ac/b.gif" data-src="http://y2.ifengimg.com/a/2014_37/d4dbca6004ab9b7.jpg" /></a>

        <p>7年前截肢的19岁癌症晚期女孩</p>

        <a href="http://news.ifeng.com/a/20140909/41906442_0.shtml#p=1"  target="_blank" ><img class="aimg" src="http://ctc.qzonestyle.gtimg.cn/ac/b.gif" data-src="http://y3.ifengimg.com/a/2014_37/9349a4b2ee90309.jpg" /></a>

        <p>7年前截肢的19岁癌症晚期女孩</p>

        <a href="http://news.ifeng.com/a/20140909/41906442_0.shtml#p=1"  target="_blank" ><img class="aimg" src="http://ctc.qzonestyle.gtimg.cn/ac/b.gif" data-src="http://y2.ifengimg.com/a/2014_37/b2491836e230932.jpg" /></a>

    </div>

    <div class="fr">

    </div>

</div>

<script>

//兼容IE对getElementsByClassName

if (navigator.appName == 'Microsoft Internet Explorer') {

    document.getElementsByClassName = function() {

        var tTagName = "*";

        if (arguments.length > 1) {

            tTagName = arguments[1];

        }

        if (arguments.length > 2) {

            var pObj = arguments[2]

        } else {

            var pObj = document;

        }

        var objArr = pObj.getElementsByTagName(tTagName);

        var tRObj = new Array();

        for ( var i = 0; i < objArr.length; i++) {

            if (objArr[i].className == arguments[0]) {

                tRObj.push(objArr[i]);

            }

        }

        return tRObj;

    }

}

//图片加载

function loadImg(imgClass,imgSrc){

    //data-src:存放需要加载的图片的路径

    var arrImg=document.getElementsByClassName(imgClass); //需要实时加载class为imgClass的图片数组

        for(var i=0; i<arrImg.length; i++){

            if(!arrImg[i].getAttribute(imgSrc)) continue;

            if(document.documentElement.scrollTop+document.body.scrollTop+document.documentElement.clientHeight >arrImg[i].offsetTop){

                arrImg[i].setAttribute("src",arrImg[i].getAttribute(imgSrc));

                arrImg[i].removeAttribute(imgSrc);

            }

        }

}

window.onload=window.onscroll=function(){loadImg("aimg","data-src")}

</script>

</body>

</html>

js图片实时加载的更多相关文章

js图片未加载完显示loading效果
<html> <title>js图片未加载完显示loading效果</title> <body> <style> img{float:lef ...
js图片预加载
图片预加载有大体有几种方式 1.html标签或css加载图片. 显而易见我们使用img标签或者通过标签的background-image属性都可以实现图片的预加载.但是为了避免初次载入过多图片影响体验 ...
JS图片懒加载
简介当页面图片太多时,加载速度就会很慢.尤其是用2G/3G/4G访问页面,不仅页面慢,而且还会用掉很多流量.图片懒加载的原理就是将页面内所有需要加载的图片全部换成一张默认的图片(一般尺寸很小),只有 ...
js 图片懒加载
图片懒加载(图片出现在可视区域再加载) 兼容性:兼容目前流行的全部浏览器,包括:兼容到IE6) 使用方法: 引入相应的js文件<script src="js/lazy.js" ...
js图片预加载与延迟加载
图片预加载的机制原理:就是提前加载出图片来,给前端的服务器有一定的压力. 图片延迟加载的原理:为了缓解前端服务器的压力,延缓加载图片,符合条件的时候再加载图片,当然不符合的条件就不加载图片. 预加载 ...
JS图片赖加载例子
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8&quo ...
JS图片预加载插件
在开发H5项目中有时候会遇到要加载大量图片的情况,利用预加载技术可以提高用户浏览时的体验. 1)概念:懒加载也叫延迟加载:JS图片延迟加载,延迟加载图片或符合某些条件时才加载某些图片.预加载:提前加载 ...
js图片预加载后触发操作
为了使得图片加载完,再触发回调函数,需进行图片预加载处理 function loadImage(url, callback) { var img = new Image(); img.src = ur ...
js图片预加载以及延迟加载
当我们需要做图片轮播的时候,如果让图片提前下载到本地,用浏览器缓存起来,我们可以用Image对象: function preLoadImg(){ var img=new Image(); img.sr ...

随机推荐

OpenStack点滴01-概览
OpenStack项目由Rackspace和NASA(美国国家航空航天局)共同发起,它是一个旨在为公共及私有云的建设与管理提供软件的开源项目. 作为一个开源云平台,OpenStack的首要任务是简化云 ...
Filter及FilterChain的使用详解
原文地址:http://blog.csdn.net/zhaozheng7758/article/details/6105749 一.Filter的介绍及使用什么是过滤器? 与Servlet相似,过滤 ...
获取MP3和M4A音乐文件的歌曲信息以及专辑图片－－备用
NSBundle* bundle = [NSBundle mainBundle]; NSString* path = [bundle bundlePath]; NSURL * file ...
awk的思维导图
android 设置背景为空(透明)
在给控件设置背景时像ps那样的背景透明在3.0以下可以使用 imageView.setBackgroundResource(android.R.id.empty); 但是这个方法在3.0以上会出现 ...
转：关于copy_to_user()和copy_from_user()的一些用法
一.Copy_to_user( to, &from, sizeof(from)) To:用户空间函数 (可以是数组) From:内核空间函数(可以是数组) sizeof(from):内核空间 ...
swipejs
http://swipejs.com/ http://www.scoop.it/t/javascript-for-mobile http://www.open-open.com/news/view/c ...
[LeetCode 109] - 将已排序链表转换为二叉搜索树 (Convert Sorted List to Binary Search Tree)
问题给出一个元素以递增序列排序的单链表,将其转换为一棵高度平衡的二叉搜索树. 初始思路二叉搜索树高度平衡,意味着左右子树的高度要平衡.根据二叉树左子树节点小于根节点,右子树节点大于根节点的性质:我 ...
Cracking the coding interview--Q1.4
原文 Write a method to replace all spaces in a string with'%20'. You may assume that the string has su ...
JavaScript IDE 大盘点，让选择不再难
文章来源:http://gcdn.gcpowertools.com.cn/showtopic-24110-1-3.html 阅读本文之前,分享大家一张图片,看图会发现JavaScript开发需求最 ...

js图片实时加载

js图片实时加载的更多相关文章

随机推荐

热门专题