javascript - 前端渲染页面

Question

PHP从数据库取出数据：

$datas = common::getDatas( "id,crtId,crtTime" , "audio" , [ "str" => "crtId=?" , "bind" => [ 1 ] ] );

PHP渲染：

<?php foreach ($datas as $row): ?>
<p id="photoWr" class="dis_ib font_f_c photoWr pos_r">
    <p class="imgWrw wh100 text_c">
        <p id="imgWr" class="text_c pos_r audioImg">
            <p>
                <a href="<?php echo HOST.'/audio/detHtml/id/'.$row['id'].'.html' ?>" >
                    <img class="cur_p " src="<?php echo '/view'.$row['cover'];?>">
                </a>
            </p>
        </p>
        <p title="<?php echo $row['audioName'];?>"><?php echo $row['audioName'];?></p>
    </p>
</p>
<?php endforeach; ?>

现在不想用后端渲染，想用PHP直接把数据json化发送到前端，直接由JS渲染：

$response["code"] = "1";
$response["mes"] = "ok";
$response["data"] = $datas;

发到前端的数据是这样的：

{"code":"1","mes":"ok","data":[{"id":"989","crtId":"1","crtTime":"2017-01-06 15:54:14"},{"id":"988","crtId":"1","crtTime":"2017-01-06 11:19:36"},{"id":"987","crtId":"1","crtTime":"2017-01-06 11:10:13"}]}

本菜鸟对JS不熟悉，只会一点基础的语法。想知道js怎么才能像PHP那样foreach，然后将需要的字段填充的HTML里面，而不是拼接HTML代码。前端有没有像PHP那样傻瓜式填充的技术？JS真的好难。

Answer 1

有啊，js 模板引擎，简单点的有 underscore.template（只能算个模板函数），复杂点的有 handlebars 等

Answer 2

html模板结合js可以满足你，不过照题主这个情况可能得过一段时间才能理解你口中的“傻瓜式”填充

另外，恕我直言，要踩随意，题主所言

对JS不熟悉，只会一点基础的语法。想知道js怎么才能像PHP那样foreach，然后将需要的字段填充的HTML里面，而不是拼接HTML代码。前端有没有像PHP那样傻瓜式填充的技术？JS真的好难

那么就去看一些js基础先呀，先去看一下基础的教程或者找一本js书籍先浏览起来，现在在线视频和在线的练习那么多，不先去看一下么？不然你会发现，JS好难，编程好难，当程序员好难，工作好难，存活好难，生活好难。。。