JavaScript的type属性等于text/html 例子
在使用JavaScript标签<script>的时候，其中type最常用的就是text/javascript
其实这个type还有其他用法，下面直接给出例子：
type属性为text/html的时候，<script>片断中定义一个被JS调用的代码，代码不会在页面上显示
- <script id="commentTemplate" type="text/html">
- <li>
- <div class="photo">
- <a href="#"> <img src="[UserImg]" /></a>
- </div>
- <p>
- <a href="#">[UserName]：</a><span class="time">[CreateDate]</span>
- </p>
- <div class="clear"></div>
- </li>
- </script>
再看上面的代码片段，我们在下面的代码中怎么使用，如下：
- <html>
- <head>
- <title>标题</title>
- </head>
- <body>
- <div id="comment_ul_2"></div>
- <input type="button" id="addFun" value="click me" />
- <script type="text/javascript">
- var reg = new RegExp("([^\[]*?)\]", 'igm'); //i g m是指分别用于指定区分大小写的匹配、全局匹配和多行匹配。
- $("#addFun").click(function() {
- var html = document.getElementById("commentTemplate").innerHTML;
- var source = html.replace(reg, function(node, key) {
- return {
- 'UserImg' : '1',
- 'UserName' : '张',
- 'CreateDate' : '2011-1-1'
- }[key];
- });
- $("#comment_ul_2").append(source);
- });
- var zzl = "name:[name]";
- zzl = zzl.replace(reg, function(node, key) {
- return {
- 'name' : '小明'
- }[key];
- });
- alert(zzl);
- </script>
- </body>
- </html>
这里解释一下：其中有一个replace，在替换时，可以接受一个json字符串，然后根据json的key来对比js模块里的key，进行赋值！
另外，网上有一些比较好的关于 text/template 模版用法的插件js，也是个很好用的模版技术。
JavaScript的type属性等于text/html 例子的更多相关文章
- 让script的type属性等于text/html
type属性为text/html的时候,<script>片断中定义一个被JS调用的代码,代码不会在页面上显示 <script id="commentTemplate&quo ...
- html <input>标签类型属性type(file、text、radio、hidden等)详细介绍
html <input>标签类型属性type(file.text.radio.hidden等)详细介绍 转载请注明:文章转载自:[169IT-最新最全的IT资讯] html <inp ...
- <script language = "javascript">, <script type = "text/javascript">和<script language = "application/javascript">(转)
application/javascript是服务器端处理js文件的mime类型,text/javascript是浏览器处理js的mime类型,后者兼容性更好(虽然application/ ...
- jquery html属性和text属性的区别
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/ ...
- HTML <input> 标签的 type 属性
HTML <input> 标签的 type 属性 HTML <input> 标签 实例 下面的表单拥有两个输入字段以及一个提交按钮: <form action=" ...
- js修改input的type属性问题
js修改input的type属性有些限制.当input元素还未插入文档流之前,是可以修改它的值的,在ie和ff下都没问题.但如果input已经存在于页面,其type属性在ie下就成了只读属性了,不可以 ...
- input的type属性
input的type属性:http://www.w3school.com.cn/tags/att_input_type.asp 基本语法: <input type="hidden&qu ...
- input表单的type属性详解，不同type不同属性之间区别
目标:详解表单input标签type属性常用的属性值 一.input标签和它的type属性 PS:input 元素可以用来生成一个供用户输入数据的简单文本框. 在默认的情况下, 什么样的数据均可以输入 ...
- Python：bs4中 string 属性和 text 属性的区别及背后的原理
刚开始接触 bs4 的时候,我也很迷茫,觉得 string 属性和 text 属性是一样的,不明白为什么要分成两个属性. html = '<p>hello world</p>' ...
随机推荐
- nginx+django+uwsgi
最近来了兴致,想搞一下django开发,so, 搭建一下环境 1.安装django,可能通过pip install 或者源码安装(因为环境是python2.6.6的环境,所以这里采用django 1 ...
- zend studio中安装Emmet插件后迅速编写html的方法
table>tr*3>th*1+td*3h1{hello} <h1>hello</h1>a[href="xx.xxx.xxx(网址) ...
- 几个SQL小知识(转)
出处:http://www.cnblogs.com/wuguanglei/p/4205976.html 写在前面的话:之前做的一个项目,数据库及系统整体构架设计完成之后,和弟兄们经过一段时间的编码,系 ...
- adb命令安装及卸载应用
一.手机连接电脑,检测手机是否已开启授权并连接成功 adb devices 二.安装应用 adb install UYUN-CARRIER-Android.apk 三.卸载应用 1.查看应用包名 ad ...
- python 日志模块工具类
#!/usr/bin/env python # -*- coding: utf-8 -*- import logging # logName 日志中的某个格式化的字段名,logFile生成的日志文件名 ...
- Android Canvas的save(),saveLayer()和restore()浅谈
save() saveLayer() restore() 1.在自定义控件当中你onMeasure和onLayout的工作做完成以后就该绘制该控件了,有时候需要自己在控件上添加一些修饰来满足需求 ...
- 函数返回值string与返回值bool区别------c++程序设计原理与实践（进阶篇）
为什么find_from_addr()和find_subject()如此不同?比如,find_from_addr()返回bool值,而find_subject()返回string.原因在于我们想说明: ...
- git Problem with the SSL CA cert (path? access rights?)
问题: [root@localhost opt]# git clone https://github.com/docker/docker.git 正克隆到 'docker'...fatal: unab ...
- 模态显示PresentModalViewController
1.主要用途 弹出模态ViewController是IOS变成中很有用的一个技术,UIKit提供的一些专门用于模态显示的ViewController,如UIImagePickerController等 ...
- MVC进阶篇（三）——model层数据验证
前言 常常在想,姓名性别那些个验证,真的有必要每次遇到,每次写验证吗?好麻烦,于是学到MVC这里,发现MVC自带数据验证,这个东西着实是个好东西.我写了一个小demo,分享给大家. 内容 一个表单的提 ...