这一段存放了一个模板。
在js里面,经常需要使用js往页面中插入html内容。比如这样:

var number = 123;
$('#d').append('<div class="t">'+number+'</div>')

如果html很短还好说,但是遇到描述里面的这么大段,直接用字符串存储会很困难,因为不光要处理单引号,还需要很多「+」号把字符串一个个连接起来,十分的不方便。
给<script>设置type="text/template",标签里面的内容不会被执行,也不会显示在页面上,但是可以在另一个script里面通过获取,然后再通过相关的模板工具进行处理,插入到页面中。这样就把大段的HTML操作从js里面分离开了。

 

<script type="text/template">是干什么的,为什么要把html写在js中? 这是什么编程语言风格,都能这样用吗?的更多相关文章

  1. 前端模板<script type="text/template" id="tmpl">

    前端模板, 比连接字符串好用多了, 还可以使用循环\判断等语句, 减少工作量 <script type="text/template" id="member-tmp ...

  2. 关于 <script type='text/template' > 的妙用 / 使用jquery获取iframe加载完成事件

    https://www.cnblogs.com/ddqyc/p/6200539.html <!DOCTYPE html> <html> <head> <met ...

  3. Js script type="text/template"的使用简单说明

    <script type="text/template" id="treeTableTpl"> <tr id="{{row.id}} ...

  4. <script type="text/x-template"> 模板

    获取动态的js模板可以用art-template插件 <script type="text/template"> 给<script>设置type=" ...

  5. 关于MVC模板渲染的一点小事type="text/template"

    先上一个demo,简单粗暴,请自便 <!DOCTYPE html> <html> <head lang="en"> <meta chars ...

  6. script标签中type为<script type="text/x-template">是个啥

    写过一点前端的都会碰到需要使用JS字符串拼接HTML元素然后append到页面DOM树上的情况,一般的写法都是使用+号以字符串的形式拼接,如果是短点的还好,如果很长很长的话就会拼接到令人崩溃了. 比如 ...

  7. JavaScript type="text/template"的用法

    JavaScript type="text/template"相当于定义一个模板,如果没有使用html()方法的话,是显示不出来的,我们直接看例子(我是在tp框架的里面写的) &l ...

  8. document.write('<script type=\"text/javascript\"><\/script>')

    document.write('<script type=\"text/javascript\"><\/script>')

  9. <script type="text/html"></script> js模版使用

    <div></div> <script type="text/html" id="javascript_template"> ...

随机推荐

  1. CSS实现超出DIV宽度文字自动隐藏并显示省略号

    当文字超出DIV宽度时,超出的文字部分省略,并用显示省略号代替,css代码如下: div.ellipsis { padding-left: 5px; text-align: left; text-ov ...

  2. springcloud16---zuul-filter

    package com.itmuch.cloud; import org.springframework.boot.SpringApplication; import org.springframew ...

  3. Fms3和Flex打造在线视频录制和回放

    本博推荐文章快速导航: Sql Server2005 Transact-SQL 新兵器学习MCAD学习 代码阅读总结 ASP.NET状态管理 DB(数据库)WAPWinFormFlex,Fms aie ...

  4. PHP curl模拟浏览器采集阿里巴巴的实现代码

    <?php set_time_limit(0); function _rand() { $length=26; $chars = "0123456789abcdefghijklmnop ...

  5. PHP获取代码段执行的毫秒时间和消耗内存

    我们在项目开发经常需要做一些优化型测试,比如优化代码段,排查代码段效率问题,或者降低内存消耗成本. <?php $start_memory = memory_get_usage(); //开始内 ...

  6. Python3 pandas用法大全

    Python3 pandas用法大全 一.生成数据表 1.首先导入pandas库,一般都会用到numpy库,所以我们先导入备用: import numpy as np import pandas as ...

  7. Linux内核源码目录说明

    Linux内核源代码位于/usr/src/linux目录下,其结构分布如图1.3所示,每一个目录或子目录可以看作一个模块,其目录之间的连线表示“子目录或子模块”的关系.下面是对每一个目录的简单描述. ...

  8. sqlite的bool字段

    简直被坑死了, bool字段更新,只能用0或1,才是正确的更新. 否则select出来的字段是错的 本来用true和false更新的,更新之后,使用sqliteexpert查看,更新结果是对的. 但是 ...

  9. ACM赛前准备——模板(排版篇)

    ACM赛前准备--模板(排版篇) 更新 前言 效果演示 封面 目录页 模板页(不分栏) 模板页(分栏) 结果文件 快速使用 准备工作 安装TexLive (可选)安装minted包 创建模板 文件结构 ...

  10. 请问使用jmeter在tcp取样器测试中服务器名称或ip,端口可以填变量值吗?

    请问使用jmeter在tcp取样器测试中服务器名称或ip,端口可以填变量值吗?