经常在js里面写一些html模板，但是由于语法不同，没有办法啊直接将html黏贴在js中。

var html = "<!DOCTYPE html>"+

  "<html>"+

  "  <body>"+

  "    <h1>Hello, world!</h1>"+

  "  </body>"+

  "</html>";

还有人这么写

var html = "<!DOCTYPE html>\

  <html>\

    <body>\

      <h1>Hello, world!</h1>\

    </body>\

  </html>";

这里介绍另一个方法，比较来说算是最友好的。

var html = (function () {/*

  <!DOCTYPE html>

  <html>

    <body>

      <h1>Hello, world!</h1>

    </body>

  </html>

*/}).toString().match(/[^]*\/\*([^]*)\*\/\}$/)[1];

最号的方法，如下

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

    <h1>Hello, world!</h1>

</script>

JS中的HTML片段的更多相关文章

  1. 在js中正则表达式验证小时分钟，将输入的字符串转换为对应的小时和分钟

    文章目录 1.预备知识 2.在js中的代码片段 3.测试结果 1.预备知识 splict()方法 Date()的相关方法 setHours()的用法 2.在js中的代码片段 //验证小时和分钟 var ...

  2. Node.js中的URL

    Node.js中的URL 什么是URL URL是Uniform Location Resource的缩写,翻译为"统一资源定位符",也就是描述资源位置的固定表示方法.被URL描述的 ...

  3. 定制Three.js中Material属性

    1.找到想要更改的着色器代码

  4. js中精度问题以及解决方案

    js中的数字按照IEEE 754的标准,使用64位双精度浮点型来表示.其中符号位S,指数位E,尾数位M分别占了1,11,52位,并且在ES5规范中指出了指数位E的取值范围是[-1074, 971]. ...

  5. 基础篇：1.JavaScript运行在html中，引用有几种方式？—— 6.js中常用的输出方式？

    书接上文,上文提到若干条JavaScript的基础性知识,大部分都是一些概念性的东西,本着认真严谨的态度,我们要认真对待,有些条目的问题是某个知识点的周边延伸,为节约篇幅,就一起整理了,如有描述不对的 ...

  6. python 全栈开发，Day52(关于DOM操作的相关案例,JS中的面向对象,定时器,BOM,client、offset、scroll系列)

    昨日作业讲解: 京东购物车 京东购物车效果: 实现原理: 用2个盒子,就可以完整效果. 先让上面的小盒子向下移动1px,此时就出现了压盖效果.小盒子设置z-index压盖大盒子,将小盒子的下边框去掉, ...

  7. JavaScript基础（3）-JS中的面向对象、定时器、BOM、位置信息

    一.创建对象的几种常用方式. 1.使用Object或对象字面量创建对象: a.使用Object()内置的构造函数来创建对象,例如: var student = new Object(); // 创建一 ...

  8. js中迭代元素特性与DOM中的DocumentFragment类型 笔记

    JS中迭代元素特性 在需要将DOM结构序列化为XML或者HTML字符串时,多数都会涉及遍历元素的特性,这个时候attributes属性就可以派上用场. 以下代码展示了如何迭代元素的每一个特性,然后将他 ...

  9. 前端JavaScript(3）-关于DOM操作的相关案例,JS中的面向对象、定时器、BOM、位置信息

    小例子: 京东购物车 京东购物车效果: 实现原理: 用2个盒子,就可以完整效果. 先让上面的小盒子向下移动1px,此时就出现了压盖效果.小盒子设置z-index压盖大盒子,将小盒子的下边框去掉,就可以 ...

随机推荐

  1. cf777c 模拟

    水题 /* 按列扫描一次矩阵,每个行向上最长sort长度即可 */ #include<bits/stdc++.h> using namespace std; #define ll long ...

  2. iOS学习笔记之Block

    写在前面 学习iOS开发的过程中,在很多场合都遇到了Block.说实话,虽然自己依葫芦画瓢的将Block"拿来"用着,但这种"拿来主义"与学习时应持有的探索精神 ...

  3. Centos7.1 mini版安装后安装图形界面教程

    [1]GNOME安装 1.执行下面命令安装GNOME Desktop Environment yum -y groups install "GNOME Desktop" 2.安装完 ...

  4. git merge简介

    git merge的基本用法为把一个分支或或某个commit的修改合并到现在的分支上.我们可以运行git merge -h和git merge --help查看其命令,后者会直接转到一个网页(git的 ...

  5. AOJ 0189 Convenient Location （Floyd）

    题意: 求某一个办公室 到其他所有办公室的 总距离最短  办公室数 不超过10 输入:多组输入,每组第一行为n (1 ≤ n ≤ 45),接下来n行是 (x, y, d),x到y的距离是d输出:办公室 ...

  6. css position[转

    2.详细展示 2.1 position:absolute 2.2.1 说明: 绝对定位:脱离文档流的布局,遗留下来的空间由后面的元素填充.定位的起始位置为最近的父元素(postion不为static) ...

  7. python全栈开发day42-固定定位等

    一.今日内容: 1.绝对定位盒子居中用法 left:50% margin-left:-盒子的一半宽度.       2.固定定位和固定定位的用法 返回顶部 固定导航栏:        3.阿里的字体图 ...

  8. BZOJ4997 [Usaco2017 Feb]Why Did the Cow Cross the Road III

    欢迎访问~原文出处——博客园-zhouzhendong 去博客园看该题解 题目传送门 - BZOJ4997 题意概括 在n*n的区域里,每一个1*1的块都是一个格子. 有k头牛在里面. 有r个篱笆把格 ...

  9. 一道有意思的多线程面试题 C# 代码实现

    如果你对多线程的控制不怎么了解,那么理解了这篇文章的内容也许对你有帮助.鼓励先自己动手实现一遍,做不出来在看代码. 题目一:两个线程交替打印0~100的奇偶数 这道题就是说有两个线程,一个名为偶数线程 ...

  10. git一些实践命令，关于reabse和merge的区别在最后做了一个比较

    git命令 一. 克隆,提交,拉取代码 1. 克隆,提交代码 git clone:远端仓库地址 git remote add upstream: 上游远端仓库地址(fork代码的原地址).添加上游远端 ...