这一段存放了一个模板。
在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. ELF文件分析

    (1)文件ELF.c (2)编译: gcc -c ELF_1.c -o ELF_1.o (3)显示文件类型: (4)查看大小: (5)转换为16进制 (6)显示各段信息 (7)分析

  2. Java基础学习笔记(一)

    Java基础学习笔记(一) Hello World 基础代码学习 代码编写基础结构 class :类,一个类即一个java代码,形成一个class文件,写于每个代码的前端(注意无大写字母) XxxYy ...

  3. 20172305 2018-2019-1 《Java软件结构与数据结构》第三周学习总结

    20172305 2018-2019-1 <Java软件结构与数据结构>第三周学习总结 教材学习内容总结 本周内容主要为书第五章内容: 队列 线性集合(元素从一端加入,另一端删除) 先进先 ...

  4. ubuntu18.04 install pip

    1. environment release version: bionic kernel version:4.15.0-29-generic 2.install pip 2.1 sudo apt-g ...

  5. 试着用React写项目-利用styled-components解决样式问题

    转载请注明出处:王亟亟的大牛之路 啰嗦之前先安利,会渐渐丰富前端的知识点 https://github.com/ddwhan0123/Useful-Open-Source-Android 昨天用web ...

  6. asp.net web api的源码

    从安装的NuGet packages逆向找回去 <package id="Microsoft.AspNet.WebApi.Core" version="5.2.7& ...

  7. Gym 101147J Whistle's New Car(dfs)

    https://vjudge.net/problem/Gym-101147J 题意: 有n个城市,每个城市有一个权值,表示在这个城市的加油站可以加多少油. 现在要计算每个城市i,有多少个城市j可以到达 ...

  8. Linux下的IPC几种通信方式

    Linux下的IPC几种通信方式 管道(pipe):管道可用于具有亲缘关系的进程间的通信,是一种半双工的方式,数据只能单向流动,允许一个进程和另一个与它有公共祖先的进程之间进行通信. 命名管道(nam ...

  9. Command(命令)

    意图: 将一个请求封装为一个对象,从而使你可用不同的请求对客户进行参数化:对请求排队或记录请求日志,以及支持可撤消的操作. 适用性: 抽象出待执行的动作以参数化某对象,你可用过程语言中的回调(call ...

  10. Qt5需要的_libstdc++6_4.7.2-5_???.deb

    1.下载地址: http://ftp.de.debian.org/debian/pool/main/g/gcc-4.7/ 2.下载的文件: 32位:libstdc++6_4.7.2-5_i386.de ...