竭诚为您提供优质文档/双击可除
html5,表单,模板
篇一:值得收藏的html5代码片段
值得收藏的html5代码片段
html5是web技术发展的重要的里程碑,对于前端开发来说,如果能够找到一些未来大家开发中可能需要经常重复使用的代码的话,相信大家一定不会拒绝,下面是红树林教育精心收集的10多个html5代码片段,相信大家一定喜欢!
html5的最简单模板
如果你需要开始一个新的html5项目的话,大家肯定会需要一个最简单的模板,这里是一个非常简单并且清晰的html5模板,相信大家会喜欢!
untitledweb的主要内容表单获取google地图
这里有一段非常简单的代码,通过用户输入地点,获取google地图地点,非常适合生成联系人表单
输入地点base64编码的1x1大小的空白giF文件
个人不推荐使用这个透明的空白gif,但是即使在20xx 年,很多人仍旧使用。可能你也喜欢使用这种方式。
src="data:image/gif;base64,R0lgodlhaqabaiaaaaaaap//
/yh5baeaaaaalaaaaaabaaeaaaibRaa7">正则表单式验证电
子邮件
html5中允许使用正则表单式来做输入验证:
正确的嵌入flash
如果你经常需要在网页中插入flash的话,这段代码你应该用的上:
视频并且支持flash的fallback
另外一个html5中最有用的特性是video标签,允许你很方便的嵌入video文件。但是很多老版本的浏览器不支持,所以下面这段代码将会非常有用
2.含src特性的img标签不触发资源请求。
下面是常用的存放方式:
1.script标签
//模板文本
//获取模板
//不能通过innertext获取,因为innertext无法获取等标签字符
vartpl=document.getelementbyid(tpl).innerhtml
tpl=tpl.replace(/^[\s\u3000]*|[\s\u3000]*$/,)
https://www.doczj.com/doc/4619162569.html,pile(tpl)({title:test})
注意:
1.若模板中包含标签会造成标签结束符混乱的问题,因此通过该方式存放模板时,不能包含结束标签;
2.script标签位置较随意,可以作为head或body的子元素。
2.textarea标签
//模板文本
//获取模板
vartplel=document.getelementbyid(tpl)
vartpl=tplel.value
//通过tplel.innertext获取也可以。但不能通过tplel.innerhtml获取,因为它会对"等转换为字符实体tpl=tpl.replace(/^[\s\u3000]*|[\s\u3000]*$/,)
https://www.doczj.com/doc/4619162569.html,pile(tpl)({title:test})
注意:
1.若模板中包含标签会造成标签结束符混乱的问题,因此通过该方式存放模板时,不能包含结束标签;
2.textarea元素必须作为body的子孙元素。
3.xmp标签(语义为标识内容用作示例,现已被标准废除了,但各大浏览器依然支持该标签)
//模板文本
//获取模板
vartplel=document.getelementbyid(tpl)
vartpl=tplel.innerhtml
//通过tplel.innertext获取也可以
tpl=tpl.replace(/^[\s\u3000]*|[\s\u3000]*$/,)
https://www.doczj.com/doc/4619162569.html,pile(tpl)({title:test})
注意:
1.若模板中包含标签会造成标签结束符混乱的问题,因此通过该方式存放模板时,不能包含结束标签;
2.xmp元素必须作为body的子孙元素。
由于模板文本中出现标签的情况较少,而出现表单元素标签的几率较大,而xmp标签已被废弃,因此还是通过script 标签存放模板文本的方式较为常见。
三、template标签的新视觉20xx年定稿的template标签为我们提供一种更统一、功能更强大的模板文本存放方式。而它基本的使用方式与之前的3种方式无太大差别://模板文本
//获取模板
vartplel=document.getelementbyid(tpl)
//通过tplel.innertext获取也可以
vartpl=tplel.innerhtml
tpl=tpl.replace(/^[\s\u3000]*|[\s\u3000]*$/,)
https://www.doczj.com/doc/4619162569.html,pile(tpl)({title:(html5,表单,模
板)test})
注意:
1.若模板中包含标签会造成标签结束符混乱的问题,因