maccms获取文章内容中的5张图片（多图列表代码）

admin

以前v8的时候我就做过类似的案例

v8的方法：

• {maccms:art num=20 pagesize=12 type=all start=1 order=desc by=time }
•   <section class="has_action">
•     <div class="item_detail">
•         <h3 class="dotdot line3">[art:name]</h3>
•         <div class="list_image detail[art:num]" >
•            [art:content]
•         </div>
•         <script type="text/javascript"><!-- 关键就在这段jq代码 -->
•                         $(".detail[art:num]").html($(".detail[art:num] img"));$(".detail[art:num] img:gt(3)").remove();</script>
•         <div class="item_info">
•           <div> [art:hits] <span class="src space">[art:from]</span>
•             <span class="cmt space">作者： [art:author]363
•               <!-- /react-text --></span>
•             <span class="time" title="[art:addtime]"> [art:addtime]</span>
•             <span  class="dislike-news fr"></span>
•           </div>
•         </div>
•       </div>
•     </section>
• {/maccms:art}
  

jq代码的用意：这里 直接使用了 [art:content]内容标签，删除class="detail+序号" 的所有HTML标签和文本数据只保留img 标签，再删除第四个img标签以后的内容。然后就只剩下 三个img 标签了，最后使用css设置样式。

控制图片的css代码：

• .list_image{height: 100px; width: 100%; overflow: hidden;}
• .list_image img{width: 30%;height: 100px;margin-left: 5px;}