拼接字符串使用es6的方法拼接

前端小白鲨

已于 2022-04-26 15:44:45 修改

阅读量2.8k

点赞数

分类专栏： web前端技术移动开发 javascript 文章标签： javascript html5 jquery html 前端

于 2022-04-26 15:42:21 首次发布

本文链接：https://blog.csdn.net/m0_37909187/article/details/124428018

版权

web前端技术同时被 3 个专栏收录

13 篇文章 0 订阅

订阅专栏

javascript

13 篇文章 0 订阅

订阅专栏

移动开发

12 篇文章 1 订阅

订阅专栏

在渲染数据列表时，需要显示不同的数据，首先循环遍历，使用es5是比较麻烦的，用es6拼接字符串比较方便，还能在字符串里面可以进行判断

实例

    for (var i = 0; i < infofile.length; i++) {
            docHtml += `<li>
                          <div class="fileinfo">
                            <i></i>
                              ${ (function(){
                                  if(infofile[i].data == "111111" ){
                                    return `<span >${infofile[i].name}</span>`
                                  }else{
                                    return `<span >${infofile[i].name}</span>`
                                  } 
                                })()
                              }
                          </div>
                          <div class="uploadicon">
                            <span title='查看'></span>
                            <span title='删除' </span>
                            <span title='下载'</span>
                          </div>
                        </li>`
          }
        jQuery('ul').html(docHtml)
  }

   最主要的还是这句
  ${ (function(){
        if(infofile[i].data == "111111" ){
          return `<span >${infofile[i].name}</span>`
        }else{
          return `<span >${infofile[i].name}</span>`
        } 
      })()
  }
必须用 ${} 给括起来

完了