<script type="text/html"></script> js模版使用
<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模版使用的更多相关文章
- document.write('<script type=\"text/javascript\"><\/script>')
document.write('<script type=\"text/javascript\"><\/script>')
- 哪种写法更好?<script></script> vs/or <script type=”text/javasript”></script>
一直很奇怪 哪种写法更好<script type=“text/javascript”>…</script> or <script>…</script>? ...
- <script language = "javascript">, <script type = "text/javascript">和<script language = "application/javascript">(转)
application/javascript是服务器端处理js文件的mime类型,text/javascript是浏览器处理js的mime类型,后者兼容性更好(虽然application/ ...
- Js script type="text/template"的使用简单说明
<script type="text/template" id="treeTableTpl"> <tr id="{{row.id}} ...
- <script type="text/x-template"> 模板
获取动态的js模板可以用art-template插件 <script type="text/template"> 给<script>设置type=" ...
- 前端模板<script type="text/template" id="tmpl">
前端模板, 比连接字符串好用多了, 还可以使用循环\判断等语句, 减少工作量 <script type="text/template" id="member-tmp ...
- script标签中type为<script type="text/x-template">是个啥
写过一点前端的都会碰到需要使用JS字符串拼接HTML元素然后append到页面DOM树上的情况,一般的写法都是使用+号以字符串的形式拼接,如果是短点的还好,如果很长很长的话就会拼接到令人崩溃了. 比如 ...
- 关于 <script type='text/template' > 的妙用 / 使用jquery获取iframe加载完成事件
https://www.cnblogs.com/ddqyc/p/6200539.html <!DOCTYPE html> <html> <head> <met ...
- <!--[if IE]><script type="text/javascript" src="matrix/js/html5.js"></script><![endif]-->代码解释
块注释例子 1. <!--[if !IE]><!--> 除IE外都可识别 <!--<![endif]-->2. <!--[if IE]> 所有的I ...
随机推荐
- PAT 1001
Calculate a + b and output the sum in standard format -- that is, the digits must be separated into ...
- MII接口全家福
转载:http://blog.chinaunix.net/uid-24148050-id-131084.html 简介: MII是英文Medium Independent Interface的缩 ...
- Android开发之神奇的Fading Edge,让你的View更有层次感!
最近在研究Android Framework层源码,发现我们对源码的理解应该建立在对API的理解之上,如果有一些API你没用过,那么即使你在源码中见到这个东西都不知道是干嘛的,更谈不上理解了.一直以来 ...
- 使用 Feedly RSS阅读器订阅技术大牛的博客
这几天一直都在自己看书,可是书上面的东西都比较落后一点,而且没有大牛博文上的东西讲的深入,可是来回跳转各位大牛的博客又非常的麻烦,有一些公众账号虽然也会推荐一些知识内容,可是你应该有过看到多个公众号发 ...
- Oracle 经典语法(二)
--提示:工资 = 薪金 + 佣金 1. 找出EMP表中的姓名(ENAME)第三个字母是A 的员工姓名.SELECT ENAME FROM SCOTT.EMP WHERE ENAME LIKE '__ ...
- sql 自定义函数-16进制转10进制
做过笔记,好记性不如烂笔头: if exists (select * from dbo.sysobjects where id = object_id(N'[dbo].[HEXTOINT]') and ...
- python(1) - 字符串
前面说过了,字符串也是一种数据类型,但字符串有一个特殊的问题,就是编码. 因为计算机是美国人发明的,所以最早只有127个字符被编码到计算机里,就是大小写英文字母,数字和一些符号,这个编码表被称为ASC ...
- Java二叉搜索树实现
树集合了数组(查找速度快)和链表(插入.删除速度快)的优点 二叉树是一种特殊的树,即:树中的每个节点最多只能有两个子节点 二叉搜索树是一种特殊的二叉树,即:节点的左子节点的值都小于这个节点的值,节点的 ...
- hdu 4630 树状数组
思路:这题的处理方式和hdu4358有点像.我们用一个pre[x]表示约数x的倍数上次出现的位置,将查询按区间的右节点升序排序.num[i]的约数为j,如果pre[j]为0,就将pre[j]置为i;否 ...
- centos下安装usb摄像头驱动
centos安装在虚拟机下,win7下能正常使用摄像头. 虚拟机显示监测到摄像头,但驱动安装失败. terminal下输入yum install cheese,提示是否安装,输入y确认下载,大概100 ...