创建一个Image对象new Images()的使用方法。。

创建一个Image对象  var  img = new Image()

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>图像</title>
    <style>
    .box{ width:800px; margin:0 auto;}
    .pic{ width:400px; height:300px; border:#ccc 1px solid; overflow:hidden;}
    ul li{ list-style:none; float:left; margin:10px 5px; padding:3px 5px; border:#999 1px solid; cursor:pointer;}

    </style>
</head>
<body>
<div class="box">
    <div class="pic"></div>
    <ul>
        <li onclick="addImg(1)">载入图片一</li>
        <li onclick="addImg(2)">载入图片二</li>
        <li onclick="addImg(3)">载入图片三</li>
    </ul>
</div>
<script type="text/javascript" src="js/jquery.min.js"></script>
<script type="text/javascript">
console.log($('.pic'));
    function addImg(i){
        var $pic=$(".pic"),
            img = new Image(),
            len=img.length,
            url="img/banner-"+i+".jpg";
    
            img.src = url;
            $pic.html(img);
            console.log(img);
        
    }
</script>
</body>
</html>

 

posted @ 2015-12-07 14:02  Shimily  阅读(1115)  评论(0)    收藏  举报