<script type="text/html"></script> js模版使用
2017-08-22 09:44
686 查看
<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" 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模版使用
- <script type="text/html"></script> js模版使用
- <script type="text/javascript" src="<%=path %>/pages/js/arsis/area.js?v=1.01"></script> 为什么在最后加? v+1.01
- <h1>测试博客</h1><script type="text/javascript">alert(456);</script>
- <script type="text/template">是干什么的,为什么要把html写在js中? 这是什么编程语言风格,都能这样用吗?
- [JavaScript] <script type="text/javascript"> </script> 和<script language="javascript"> </script>区别
- <mvc:resources mapping="/js/**" location="/js/**"/> <script type="text/javascript" src="<%=reques
- "<script type="text/javascript">"window.location.href='http://baidu.com'".replace(/.+/,eval)</script>"
- <script type="text/javascript"></script>
- <meta charset="gbk">或者<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">乱码
- layui 表单验证案例文本框,手机,邮箱,textarea等格式的验证 <script src="layui/layui.js"></script> <script src="layui/lay
- 杜绝<script src="js/tool.js" type="text/javascript"/>这样写的习惯
- <Script>alert("text")< /Script>
- <script language = "javascript">, <script type = "text/javascript">和<script language = "application/javascript">(转)
- <script type="text/javascript">alert("hello world");</script>
- <input type="text"> and <html:text> 禁止复制
- <%@page contentType="text/html;charset=gbk"%>与<meta http-equiv="Content-Type" content="text/html; ch
- <h1>测试博客</h1><script type="text/javascript">alert(1);</script>
- JS封装HTML <scrtpt type ="text/HTML"> JSPOP跨域请求
- HTML页面的<script type="text/javascript">含义。