<div></div>

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

<div onclick="_dom()">

<ul id="wrap">

<li>1</li>

<li>2</li>

<li>3</li>

<li>4</li>

</ul>

</div>

</script>

1.首先这种写,在页面渲染的时候,浏览器不会读取script标签中的html代码

2.外面不能获取到里面的div节点

所以:

在使用时,要在script标签上加个ID可以供我们找到它,

即然做模版用,且里面的html代码不会被渲染读取,则需在外面再新建一个div来当容器,装下这些html代码,

即我们可以通过
                             var _html=document.getElementById('javascript_template').innerHTML;

document.getElementsByTagName('div')[0].innerHTML=_html;

然后我们模版里的htmll代码就可以运行在页面中了;

如果遇到html代码加入外部div后,获取不到节点的情况,可以在外部写个函数,然后在html内部用行内调用 onclick="_dom()"

function _dom() {

document.getElementById('wrap')

}

<script type="text/html"></script> js模版使用的更多相关文章

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

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

  2. 哪种写法更好?<script></script> vs/or <script type=”text/javasript”></script>

    一直很奇怪 哪种写法更好<script type=“text/javascript”>…</script> or <script>…</script>? ...

  3. <script language = "javascript">, <script type = "text/javascript">和<script language = "application/javascript">(转)

          application/javascript是服务器端处理js文件的mime类型,text/javascript是浏览器处理js的mime类型,后者兼容性更好(虽然application/ ...

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

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

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

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

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

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

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

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

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

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

  9. <!--[if IE]><script type="text/javascript" src="matrix/js/html5.js"></script><![endif]-->代码解释

    块注释例子 1. <!--[if !IE]><!--> 除IE外都可识别 <!--<![endif]-->2. <!--[if IE]> 所有的I ...

随机推荐

  1. 深入MySQL源码 学习方法 何登成专家

    MYSQL 技术圈 有哪些做得好,又注重分享的公司: Oracle MySQL, MariaDB, Percona,Google, FB, Twitter, Taobao, NetEase… 有哪些值 ...

  2. focusky 购买指南

    升级Focusky动画演示大师 所有版本一次购买,终身使用,无限制作,免费升级.支付方式:支付宝.淘宝.银行转账.支付宝付款:点击表格中的“立即购买“进入购买页面->选择版本.数量,并填写详细的 ...

  3. Build类

    在开发中 我们有时候会需要获取当前手机的系统版本来进行判断,或者需要获取一些当前手机的硬件信息. android.os.Build类中.包括了这样的一些信息.我们可以直接调用 而不需要添加任何的权限和 ...

  4. linux中的等待队列

    最近看epoll 和 select 都涉及到一个东西叫做设备等待队列,等待队列是如何工作的,内核是怎么管理的?看这篇文章 问题:进程是如何组织起来的?我们知道,进程是有很多种状态的:include/l ...

  5. Android 高级UI设计笔记05:使用TextView实现跑马灯的效果

    1. 使用TextView属性实现跑马灯的效果: (1). 新建一个Android工程,命名为"MarqueeTextViewDemo",如下: (2). 来到activity_m ...

  6. Android(java)学习笔记109:通过反射获取成员变量和成员方法并且使用

    一.反射获取成员变量并且使用: 1.获取字节码文件对象:         Class c = Class.forName("cn.itcast_01.Person"); 2.使用无 ...

  7. css3 一些属性

    ==text-shadow== 语法:text-shadow: x-offset y-offset blur-radius color text-shadow:X 轴偏移量 Y轴偏移量 模糊半径 阴影 ...

  8. dede只调用当天发布的文档

    dede只调用当天发布的文档 dede文章的调用 我需要织梦的模板分别调用,一天内发布的文章,三天内发布的文章,和七天内发布的文章,请问是代码是怎么写的,如何调用,如图所示. 点一天内,显示最近24的 ...

  9. 关于同步VSS服务器上的代码发生Eclipse里面的项目全部不见了

    有次在同步VSS服务器上的代码的时候突然发生了错误(同步的代码的项目竟然消失了)....如下图 Could not open the editor: The file does not exist. ...

  10. ListView使用自定义适配器的情况下实现适配器的控件点击事件执行Activity界面中的方法

    如果ListView使用的是自定义的适配器,比如MyArrayAdapter extends ArrayAdapter<String> 那么,如何实现适配器中的点击事件执行activity ...