<script type="text/html" id="tmp">
<div class="cla">
<ul>
<li>{{age}}</li>
<li>{{name}}</li>
</ul>
</div>
</script>
<script>
var data = {
name: ,
age: "你好吗"
}
var tmp = document.getElementById('tmp');
var ss = document.getElementsByClassName('echarts')[]; var tmplate = tmp.innerHTML;
var html = '';
for (var i = ; i < ; i++) {
var c = tmplate; html = html + c.replace('{{name}}', data.name + i).replace('{{age}}', data.age + i); } ss.innerHTML = html

<script type="text/html" id="tmp">

再也不用字符串拼接dom元素了的更多相关文章

  1. jquery 追加元素/jquery文档处理,插入、修改、移动、删除指定的DOM元素.

    jquery 追加元素 $("#content").append("..."); // 添加到元素内部最后面 $("#content").p ...

  2. jquery操作DOM 元素(3)

    .detach() 从DOM 中去掉所匹配的元素. .detach([selector]) selector 一个选择表达式将需要移除的从匹配的元素中过滤出来. $("p").de ...

  3. jquery 操作DOM元素(1)

    .clone() 创建一个匹配的元素集合的深度拷贝. .clone([withDataAndEvents]) withDataAndEvents (默认为false) 一个Boolean 表示是否会复 ...

  4. 操作 html 的时候是使用 dom 方法还是字符串拼接?

    比如一个列表里面有很多个 li,要给他们加上数据.但多少个 li 是不确定的,由后台数据确定.这时候,就要动态生成 html 内容了. 那么,这个过程, 是使用 += 方法把标签.数据进行一个个的字符 ...

  5. 字符串拼接和dom回流

    以对象的角度分析  对象的两方面 属性和方法 研究对象,主要是研究对象的属性和方法 案例: <ul id="list"> <li></li> & ...

  6. JQUERY选择和操作DOM元素(利用正则表达式的方法匹配字符串中的一部分)

    JQUERY选择和操作DOM元素(利用正则表达式的方法匹配字符串中的一部分) 1.匹配属性的开头 $("[attributeName^='value']"); 2.匹配属性的结尾 ...

  7. 关于jq的load不用回调获取其中dom元素方法

    jq的load方法如果要操作其中的dom元素,需要使用回调,等其加载完了再进行dom元素的获取,今天看我们项目组长写的一段代码,发现不用回调也能获取到其中的元素. 具体是这样写的: <scrip ...

  8. 案例(拖拽对话框、高清放大镜、自制滚动条、元素的隐藏方式、表格隔行变色、tab切换效果、字符串拼接、刷新评论)

    一.拖拽对话框 <style> .of{ width: 500px; } #link,#close{ text-decoration: none; margin: 0 10px; font ...

  9. js正则获取html字符串指定的dom元素和内容

    var str = "<div>111<p id='abc'>3333</p></div><div>222<div id=' ...

随机推荐

  1. 第12篇Kubernetes 监控

        一.Weave Scope: Weave Scope 容器地图   创建 Kubernetes 集群并部署容器化应用只是第一步.一旦集群运行起来,我们需要确保一起正常,所有必要组件就位并各司其 ...

  2. C语言结构体实例-创建兔子

    参考裸编程思想. #include <stdio.h> //#include "ycjobject.h" // 颜色定义 #define CL_BLACK 0 #def ...

  3. python--内置函数、匿名函数、递归调用

    匿名函数 有名函数: def func1(x): print(func1) 结果: <function func1 at 0x00000000005C3E18> 匿名函数: func2=l ...

  4. paper 139:qt超强绘图控件qwt - 安装及配置

    qwt是一个基于LGPL版权协议的开源项目, 可生成各种统计图.它为具有技术专业背景的程序提供GUI组件和一组实用类,其目标是以基于2D方式的窗体部件来显示数据, 数据源以数值,数组或一组浮点数等方式 ...

  5. layui-treeTable v2.0添加搜索功能

    layui-treeTable 添加搜索功能 在树形表格头部加一个input框: <div class="layui-inline"> <input class= ...

  6. 调用windows的复制文件对话框

    function CopyFileDir(sDirName: String; sToDirName: String): Boolean; var fo: TSHFILEOPSTRUCT; begin ...

  7. rsync和rsync后台模式

    注意(有软连接的rsync同步,-L可以把软链接里的当普通文件同步.-l 只同步软链接不同步软链接指向的目录或文件) rsync命令详解 rsync -a 归档模式 ,表示以递归方式传输文件,并保持所 ...

  8. flutter 接入阿里云OSS

    之前因为使用正常文件上传,用户多时拥堵无法正常上传,因此接入阿里OSS 来解决这个问题.本来打算整原生那块,看了下比较麻烦,用flutter dio 直接请求oss 完成 1.上传用到了image_p ...

  9. 通过create-react-app从零搭建react环境

    一. 快速开始: 全局安装脚手架: $ npm install -g create-react-app 通过脚手架搭建项目: $ create-react-app <项目名称> 开始项目: ...

  10. 自定义缓存管理器 或者 Spring -- cache

    Spring Cache 缓存是实际工作中非常常用的一种提高性能的方法, 我们会在许多场景下来使用缓存. 本文通过一个简单的例子进行展开,通过对比我们原来的自定义缓存和 spring 的基于注释的 c ...