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')

                      }