ES6--反引号的标签使用

Posted QinXiao.Shou

tags:

篇首语:本文由小常识网(cha138.com)小编为大家整理,主要介绍了ES6--反引号的标签使用相关的知识,希望对你有一定的参考价值。

 1 /*动态初始退出登出框话模态框*/
 2 /*动态的初始化退出登陆模态框  反引号ES6语法
 3 * 为什么在使用字符串格式直接创建模态框
 4 * 1.不能在html页面中创建模板,因为如果换一个页面就没有对应的模板了。毕竟js文件最终在对应的静态文件中运行
 5 * 2.也不能在js文件中直接创建script模板,因为语法不支持
 6 * 3.所以我们使用ES6的新语法来创建多行代码,生成模态框*/
 7 (function () {
 8     var html = ` <div class="modal fade" id="ExitModel" tabindex="-1" role="dialog" aria-labelledby="myModalLabel">
 9             <div class="modal-dialog" role="document">
10                 <div class="modal-content">
11                     <div class="modal-header">
12                         <button type="button" class="close" data-dismiss="modal" aria-label="Close"><span aria-hidden="true">&times;</span></button>
13                         <h4 class="modal-title" id="myModalLabel">温馨提示</h4>
14                     </div>
15                     <div class="modal-body">
16                         你确定要退出管理系统吗?
17                     </div>
18                     <div class="modal-footer">
19                         <button type="button" class="btn btn-default" data-dismiss="modal">取消</button>
20                         <button type="button" class="btn btn-primary">确定</button>
21                     </div>
22                 </div>
23             </div>
24         </div>`;
25     $(".myExitModel").html(html);
26 })();

html页面代码:

1 <div class="myExitModel">
2        
3     </div>

 

以上是关于ES6--反引号的标签使用的主要内容,如果未能解决你的问题,请参考以下文章

反引号后无法检查chrome devtools源

ES6模板字符串

ES6学习 第三章 字符串的扩展

javascript es6新增语法之`${}`

strict模式(ES6)

es6 模板字符串