js实现产品页点击小图在大图区显示

企业网站产品图片可能会比较多，需要在产品页面多放几张展示图片，我们可以使用一张大图+几张小图的形式排列，并使用js代码实现点击小图显示大图。效果如下所示

html代码部分：
<div class="img_bd">
    <img src="/e/picture/180613/1-1P6130ZH6.jpg" alt=' ' class="img-responsive center-block" id="pic" curindex="0"/>
</div>
<div class="img_hd">
    <div class="tempWrap" style="overflow: hidden; position: relative;">
        <ul style="left: 0px; position: relative; overflow: hidden; padding: 0px; margin: 0px;">
            <li style="float: left;"><img src="/e/picture/180613/1-1P6130ZH6.jpg" data-large="/e/picture/180613/1-1P6130ZH6.jpg" alt=''/></li>