码迷,mamicode.com
首页 > 其他好文 > 详细

base64编码成功后并在页面上显示出想要展现的图片张数

时间:2020-07-03 17:28:07      阅读:106      评论:0      收藏:0      [点我收藏+]

标签:展现   length   pre   str   let   code   creat   个数   bsp   

 首先准备一个容器div将想要显示的图片放在其中;

1 <div style="width: 256px;height: 410px;">
2     <div style="width: 100%;height: 100%; " id="ImgBox">
3         <!-- img将要显示的图片 -->
4     </div>
5 </div>
base64编码成功后,可将base64编码进行如下操作;且arr.length是你想要显示在页面上图片的个数;

 //创建一个空数组
 var arr = [];

var
ImgBox = document.getElementById(‘ImgBox‘)
//arr.length 数组的长度
if (arr.length > 0) {
  //删除数组中的图片 arr.shift()
   //增加图片 arr.push(str)
//删除第一张图片 var imgs = document.getElementsByClassName(‘sameImg‘) imgs[0].remove(); var img = document.createElement(‘img‘) img.className = "sameImg"
  //data:;base64加上base64转码后str 即可形成照片路径 img.src img.src = "data:;base64," + arr[0] ImgBox.appendChild(img)
}
else { arr.push(str) var img = document.createElement(‘img‘) img.className = "sameImg" for (let i = 0; i < arr.length; i++) { img.src = "data:;base64," + arr[i]; } ImgBox.appendChild(img) }

 

base64编码成功后并在页面上显示出想要展现的图片张数

标签:展现   length   pre   str   let   code   creat   个数   bsp   

原文地址:https://www.cnblogs.com/SYJ1205/p/13231234.html

(0)
(0)
   
举报
评论 一句话评论(0
登录后才能评论!
© 2014 mamicode.com 版权所有  联系我们:gaon5@hotmail.com
迷上了代码!