模板字面量的最简单语法，是使用反引号（ `）（Tab上面那个键）来包裹普通字符串，而不是用双引号或单引号。

<!DOCTYPE html>

<html lang="en">

<head>

  <meta charset="UTF-8">

  <meta name="viewport" content="width=device-width, initial-scale=1.0">

  <meta http-equiv="X-UA-Compatible" content="ie=edge">

  <title>Document</title>

</head>

<body>

  <div id="template">

  </div>

</body>

<script>

  //变量

  let name = "Nicholas";

  //方法

  function makeUpperCase(word) {

    return word.toUpperCase();

  }

  let element = `

              <div>

                  Hello, ${name}

              </div>

              <ul>

                  <li>1.${makeUpperCase('tell me!')}</li>

                  <li>2.call me!~</li>

              </ul>

              `.trim();

  document.getElementById("template").innerHTML = element;

</script>

</html>

ES6 - 字符串的扩展（模版字符串）的更多相关文章

  1. ES6箭头函数及模版字符串

    var f = v => v; 等同于: var f = function(v) { return v; }; 箭头函数可以与变量解构结合使用: const full = ({ first, l ...

  2. ES6之模版字符串

    ES6之模版字符串 最近在项目中使用了ES6的模版字符串,在这里加以总结. 1.之前我们也可以使用JavaScript输出模版字符串,通常是下面这样的: $("#result"). ...

  3. ES6 模版字符串及常用的es6扩展方法

    1.ES6 模版字符串es6 模版字符串主要用于简化字符串的拼接 <script type="text/javascript"> let obj={name:'rdb' ...

  4. es6 字符串的扩展和数值的扩展

    es6字符串的扩展 1. es6新增的一些方法 1.1 includes 判断是否包括在内,返回一个 true or false 1.2 statsWith 判断是否以什么开头,返回一个 true o ...

  5. ES6的新特性（4）——字符串的扩展

    字符串的扩展 ES6 加强了对 Unicode 的支持,并且扩展了字符串对象. 字符的 Unicode 表示法 JavaScript 允许采用\uxxxx形式表示一个字在\u0000~\uFFFF之间 ...

  6. es6中的模版字符串

    目录 字符串拼接 includes() startsWith() endsWith() padStart() es6中的模版字符串替代了原有的字符串拼接功能. 字符串拼接 es5方式 传统的字符串拼接 ...

  7. ES6学习笔记(3)----字符串的扩展

    参考书<ECMAScript 6入门>http://es6.ruanyifeng.com/ 字符串的扩展ES6之前只能识别\u0000 - \uFFFF 之间的字符,超过此范围,识别会出错 ...

  8. ES6学习历程(字符串的扩展)

    字符串的扩展 在看这一节的时候前半部分写的都是关于unicode的内容,我个人感觉这部分在实际的开发中用的很少,所以不打算在做记录,等届时用到再有针对性的看,所以就将在ES6里面关于字符串操作的一些新 ...

  9. ES6学习笔记（三）字符串的扩展

    ES6 加强了对 Unicode 的支持,并且扩展了字符串对象. 1.字符的Unicode表示法 JavaScript 允许采用\uxxxx形式表示一个字符,其中xxxx表示字符的 Unicode 码 ...

  10. 字符串的扩展(ES6)

    文章目录 字符串的扩展 1. 字符的Unicode表示法 2. codePointAt() 3. String.fromCodePoint() 4. 字符串的遍历器接口 5. at()(提案) 6. ...

随机推荐

  1. SQL SERVER-查看内存使用情况

    --使用内存的各对象 SELECT type, sum(virtual_memory_reserved_kb) as VM_Reserved, sum(virtual_memory_committed ...

  2. k8s管理存储资源

    1. Kubernetes 如何管理存储资源 理解volume 首先我们学习 Volume,以及 Kubernetes 如何通过 Volume 为集群中的容器提供存储:然后我们会实践几种常用的 Vol ...

  3. crontab 定时任务简单备份数据库

    备份数据库/usr/local/mysql5.5/bin/mysqldump -uroot -p1234abcd wordpress >~/wordpress_20151206.sql 59 2 ...

  4. IoT设备上的恶意软件——通过漏洞、弱密码渗透

    2018年,是 IoT 高速发展的一年,从空调到电灯,从打印机到智能电视,从路由器到监控摄像头统统都开始上网.随着5G网络的发展,我们身边的 IoT 设备会越来越多.与此同时,IoT 的安全问题也慢慢 ...

  5. 项目Alpha冲刺随笔集合

    班级:软件工程1916|W 作业:项目Alpha冲刺 团队名称:SkyReach 目标:完成项目Alpha版本 项目Github地址 评审表 团队博客汇总 队员学号 队员姓名 个人博客地址 备注 22 ...

  6. Objective-C 消息发送与转发机制原理（摘）

    八面玲珑的 objc_msgSend 此函数是消息发送必经之路,但只要一提 objc_msgSend,都会说它的伪代码如下或类似的逻辑,反正就是获取 IMP 并调用: id objc_msgSend( ...

  7. linux修改镜像

    修改为163yum源-mirrors.163.com 1.首先备份系统自带yum源配置文件/etc/yum.repos.d/CentOS-Base.repo [root@localhost ~]# m ...

  8. 面向开发人员的Windows错误报告（WER）

    Windows错误报告是更新的Windows XP上Dr.Watson的替代品.它监视故障并收集可以发送到要分析的服务器(如果用户允许)的有用信息.这项功能帮助微软修复了很多错误——由于收到的报告,微 ...

  9. markdown转html

    今天临时要写接口文档,然后发现部门给的文档是markdown文件的,而接口文档是要html格式的,因此想直接把markdown转为html 这里我使用的是marked 首先初始化一个node项目 np ...

  10. 花了两个星期，我终于把 WSGI 整明白了

    在 三百六十行,行行转 IT 的现状下,很多来自各行各业的同学,都选择 Python 这门胶水语言做为踏入互联网大门的第一块敲门砖,在这些人里,又有相当大比例的同学选择了 Web 开发这个方向(包括我 ...