js两种拼接字符串的简单方法(必看)


Posted in Javascript onSeptember 02, 2016

如下所示:

function(msgArr) {
  var len = msgArr.length;
  var n = 0 ;
  var htmlSpan = "";
  for (var j = 0; j < len - 1; j++) {
    htmlSpan += '<span>·</span>';
  }
  htmlSpan += '<span class="on">·</span>';
  var imgs = [];
  var img = [];
  img[0] = '<a href="' + ctx + '/webservice/dish/detail?id=';
  img[1] = '#';
  img[2] = '"><img src="';
  img[3] = '#';
  img[4] = '"></a>';

  for (var i = 0; i < len; i++) {
    img[1] = msgArr[i].id;
    img[3] = msgArr[i].pic;
    imgs.push(img.join(""));
  }
  $("#banner_list").html(imgs.join(""));
  $(".dots").html(htmlSpan);
}

上面的代码取自我最近写的一个脚本,在这个函数中,正好体现了两种js拼接字符串从而为DOM添加新元素,第一种方法是直接相加,第二种是利用数组的join()方法进行拼接,第二种效率要高些。

以上这篇js两种拼接字符串的简单方法(必看)就是小编分享给大家的全部内容了,希望能给大家一个参考,也希望大家多多支持三水点靠木。

Javascript 相关文章推荐
JavaScript 未结束的字符串常量常见解决方法
Jan 24 Javascript
jQuery动态改变图片显示大小(修改版)的实现思路及代码
Dec 24 Javascript
基于jquery实现的可编辑下拉框实现代码
Aug 02 Javascript
轮播图组件js代码
Aug 08 Javascript
Bootstrap模态框水平垂直居中与增加拖拽功能
Nov 09 Javascript
Angularjs中使用layDate日期控件示例
Jan 11 Javascript
Vue.js 单页面多路由区域操作的实例详解
Jul 17 Javascript
10行原生JS实现文字无缝滚动(超简单)
Jan 02 Javascript
Node.js 使用AngularJS的方法示例
May 11 Javascript
微信小程序实现折叠与展开文章功能
Jun 12 Javascript
jquery判断滚动条距离顶部的距离方法
Sep 05 jQuery
深入浅析vue全局环境变量和模式
Apr 28 Javascript
AngularJs Understanding the Controller Component
Sep 02 #Javascript
JS 拼凑字符串的简单实例
Sep 02 #Javascript
AngularJs Understanding the Model Component
Sep 02 #Javascript
浅谈js中StringBuffer类的实现方法及使用
Sep 02 #Javascript
AngularJs Dependency Injection(DI,依赖注入)
Sep 02 #Javascript
js实现String.Fomat的实例代码
Sep 02 #Javascript
在Docker快速部署Node.js应用的详细步骤
Sep 02 #Javascript
You might like
PHP数组交集的优化代码分析
2011/03/06 PHP
深入解析PHP的Yii框架中的event事件机制
2016/03/17 PHP
用一段js程序来实现动画功能
2007/03/06 Javascript
jQuery调用RESTful WCF示例代码(GET方法/POST方法)
2014/01/26 Javascript
js 截取或者替换字符串中的数字实现方法
2016/06/13 Javascript
JS简单设置下拉选择框默认值的方法
2016/08/20 Javascript
Nodejs下用submit提交表单提示cannot post错误的解决方法
2016/11/21 NodeJs
JavaScript实现动态增删表格的方法
2017/03/09 Javascript
jQuery实现动态删除LI的方法
2017/05/30 jQuery
vue2.0 自定义日期时间过滤器
2017/06/07 Javascript
Vue单页面应用保证F5强刷不清空数据的解决方案
2018/01/31 Javascript
新版vue-cli模板下本地开发环境使用node服务器跨域的方法
2018/04/03 Javascript
详解webpack自定义loader初探
2018/08/29 Javascript
layer.open组件获取弹出层页面变量、函数的实例
2019/09/25 Javascript
[08:44]和酒神一起战斗 DOTA2教你做大人
2014/03/27 DOTA
python实现发送和获取手机短信验证码
2016/01/15 Python
Python实现读取Properties配置文件的方法
2018/03/29 Python
python requests 测试代理ip是否生效
2018/07/25 Python
Python 创建新文件时避免覆盖已有的同名文件的解决方法
2018/11/16 Python
python实现dijkstra最短路由算法
2019/01/17 Python
如何利用Python分析出微信朋友男女统计图
2019/01/25 Python
Python函数的默认参数设计示例详解
2019/12/01 Python
tensorflow:指定gpu 限制使用量百分比,设置最小使用量的实现
2020/02/06 Python
Django+RestFramework API接口及接口文档并返回json数据操作
2020/07/12 Python
使用CSS3 制作一个material-design 风格登录界面实例
2016/12/12 HTML / CSS
用canvas实现图片滤镜效果附演示
2013/11/05 HTML / CSS
详解基于canvas的视频遮罩插件
2018/01/04 HTML / CSS
HTML5 video循环播放多个视频的方法步骤
2020/08/06 HTML / CSS
英国领先的杂志订阅网站:Magazine.co.uk
2018/01/25 全球购物
大学生自我评价范文分享
2014/02/21 职场文书
函授生自我鉴定
2014/03/25 职场文书
工作说明书格式
2014/07/29 职场文书
祖国在我心中演讲稿450字
2014/09/05 职场文书
干部四风问题整改措施思想汇报
2014/10/13 职场文书
2015年创先争优活动总结
2015/03/27 职场文书
MySQL 8.0 Online DDL快速加列的相关总结
2021/06/02 MySQL