分享一个比较简单，又能拿出去装逼的技术——JS字符串拼接。
适用人群：JS学习爱好者；
适用场合：跟一群JS初学者在一起时、跟女同学独处时等。
那么接下来开始吧：
1、假如我需要画出三个盒子，每个盒子里面分别是姓名和年龄，那么我的代码可以这么写(当然，你也可以尝试到浏览器观看效果，看看是否会与结尾呈现的最终要过一致)：
2、但是，目前我的需求是比较简单的，只有三个盒子，就算把名字和年龄全改了，也不会太麻烦。而现在如果有100个div，那么你就需要输入100次人名和年龄，那么这是非常痛苦的，显然不能把这些数据写死。这种情况往往我们会从后台调取一些数据，而在前台的代码中，我们需要让这些数据“变活”，这个时候，可以参考下面的做法：
① 先定义一个数组，用来存放这些数据：
② 将div>h1+p的这个结构复制一下，然后通过JS将它们以字符串的形式拼接起来：
③ 现在看到的文字(张三 and 此人今年23岁)是一个错误的写法，而且就算加了引号，也是变成了字符串，那么这个值就是死的，这样就无法动态控制这些数据，于是，我们可以开始考虑，将上面数组中的数据导入到现在文字所处的区域。
这里有两个步骤要注意：
一是先将原先html中的所有代码注释掉，避免干扰；
二是可以通过for循环来将三组数据遍历到文字所在的地方，具体方法如下：
④ 这里有个小地方要解释一下，bd指的是body标签的id名。
3、通过这个方法，就可以实现将data里面的数据全部转移到页面中呈现，最终的效果与一开始是一样的：
4、最后总结一下：这里面运用到的知识其实很浅，更好的说法是：这只是一个网页开发的小技巧，希望大家可以作为参考与了解！
此处提供源码下载：
网友评论