js 一数组分割成若干个数组,并装换成字符串赋个li标签
2024-10-21 09:56:40
success: function (datas) { //请求成功后处理函数。
var htmltext = '';
var data = datas.result;
console.log(data)
var ihtml = [];
for (var i in data) {
ihtml.push('<div class="col-md-3 col-sm-6 col-xs-6">'
+ '<img src="' + data[i].img + '" width="240" height="180"/>'
+ '</div>') } var len = ihtml.length/4;
len = parseInt(ihtml.length%4!=0?len+1:len);
console.log(len);
for(var i=0;i<len;i++){
var start = i*4;
var end = start+4;
end = end>ihtml.length?ihtml.length:end;
ihtml.slice(start,end);
console.log(ihtml.slice(start,end))
htmltext += '<li>' +
'' + (ihtml.slice(start,end)).join("") + '' +
'</li>'
console.log(1)
} console.log(ihtml)
console.log(htmltext);
$(".coop-ul").html(htmltext); },
<ul class="coop-ul">
<li>
<div class="col-md-3 col-sm-6 col-xs-6">
<!-- <a href="javascript:return false;" target="_blank"> -->
<img src="img/01.png" width="190">
<!-- </a> -->
</div>
<div class="col-md-3 col-sm-6 col-xs-6">
<!-- <a href="javascript:return false;" target="_blank"> -->
<img src="img/02.png" width="190">
<!-- </a> -->
</div>
<div class="col-md-3 col-sm-6 col-xs-6">
<!-- <a href="javascript:return false;" target="_blank"> -->
<img src="img/03.png" width="190">
<!-- </a> -->
</div>
<div class="col-md-3 col-sm-6 col-xs-6">
<!-- <a href="javascript:return false;" target="_blank"> -->
<img src="img/04.png" width="190">
<!-- </a> -->
</div>
</li>
<li class="li2">
<div class="col-md-3 col-sm-6 col-xs-6">
<!-- <a href="javascript:return false;" target="_blank"> -->
<img src="img/05.png" width="190">
<!-- </a> -->
</div>
<div class="col-md-3 col-sm-6 col-xs-6">
<!-- <a href="javascript:return false;" target="_blank"> -->
<img src="img/06.png" width="190">
<!-- </a> -->
</div>
<div class="col-md-3 col-sm-6 col-xs-6">
<!-- <a href="javascript:return false;" target="_blank"> -->
<img src="img/07.png" width="190">
<!-- </a> -->
</div>
<div class="col-md-3 col-sm-6 col-xs-6">
<!-- <a href="javascript:return false;" target="_blank"> -->
<img src="img/08.png" width="190">
<!-- </a> -->
</div>
</li>
<li class="li3">
<div class="col-md-3 col-sm-6 col-xs-6">
<!-- <a href="javascript:return false;" target="_blank"> -->
<img src="img/09.jpg" width="190">
<!-- </a> -->
</div>
<div class="col-md-3 col-sm-6 col-xs-6">
<!-- <a href="javascript:return false;" target="_blank"> -->
<img src="img/10.jpg" width="190" height="120">
<!-- </a> -->
</div>
<div class="col-md-3 col-sm-6 col-xs-6">
<!-- <a href="javascript:return false;" target="_blank"> -->
<img src="img/07.png" width="190">
<!-- </a> -->
</div>
<div class="col-md-3 col-sm-6 col-xs-6">
<!-- <a href="javascript:return false;" target="_blank"> -->
<img src="img/08.png" width="190">
<!-- </a> -->
</div>
</li>
</ul>
最新文章
- cocos基础教程(5)数据结构介绍之cocos2d::Value
- Java Hour 32 Weather ( 5 ) struts2 &ndash; Action class
- JAVA继承时this和super关键字
- MySQL(5.6) 函数
- 菜鸟Android之路(上)
- FileUtil.java
- 原型模式和基于原型继承的js对象系统
- win10 uwp 如何让一个集合按照需要的顺序进行排序
- FreeSWITCH 内线拨号 总是使用 dialplan/public 拨号计划,而对 dialplan/default 视而不见
- 团队作业7——Beta版本冲刺计划及安排
- jsp参数乱码解决
- BBS论坛(二十六)
- WSL(Windows Subsystem for Linux)笔记一安装与使用
- 处理smartgit 过期脚本
- “百度杯”CTF比赛 九月场---123
- 洛谷P2900 [USACO08MAR]土地征用Land Acquisition(动态规划,斜率优化,决策单调性,线性规划,单调队列)
- Tkinter(2.x 与3.X的区别)
- Exception sending context initialized event to listener instance of class org.springframework.web.context.ContextLoaderListener
- 《Linux 性能及调优指南》2.3 监控工具
- Linq使用技巧及查询示例(一)