这篇文章发布于 2013年02月20日,星期三,00:59,归类于 外文翻译。 阅读 53557 次, 今日 4 次 2 条评论
by zhangxinxu from http://www.zhangxinxu.com
本文地址:http://www.zhangxinxu.com/wordpress/?p=3020
主要维护:Alexander Farkas
添砖加瓦:Sjoerd Visscher, Sam Ruby, John Resig, Remy Sharp, Faruk Ates, Kangax, John David Dalton, PorneL, Mathias Bynens, Paul Irish, Jonathan Neal 以及 Alexander Farkas
html5shiv可以通过很简单的JS调用,让IE6-IE9浏览器都支持HTML5中的元素,以下为该项目readme.md中的中文翻译。
HTML5 Shiv这厮
HTML5 Shiv这厮可以让具有考古价值的Internet Explorer向HTML5相关元素跪拜求饶,同时为IE6-9, Safari 4.x (以及iPhone 3.x), 以及Firefox 3.x提供基本的HTML5样式。
这些文件做什么的?
html5shiv.js
- 包含基本的
createElement()
“迷惑”技术,即使用document.createElement
以及document.createDocumentFragment
的运行悄悄进行动态的修改。同时还为HTML5元素元素提供基本的样式(如,对IE6~9应用article,...,section{display:block}
)等。
html5shiv-printshiv.js
- 上面的都有,同时含有一种机制,允许IE6-8浏览器在打印的时候HTML5元素被样式化以及包含子元素。
现在谁能让我疯狂?
HTML5 Shiv由Alexander Farkas, Jonathan Neal, Paul Irish维护,John-David Dalton做了许多贡献。也收到Modernizr以及其他两个google code项目的垂青, html5shiv以及html5shim, 由Remy Sharp维护.
如果这些实现有任何问题,你可以在这里报告!:)
关于HTML5 Shiv的完整故事以及所有参与其诞生的人,可以阅读“HTML5 Shiv的前世今生”,//zxx: 我查了下,有中文相关文章“HTML5 Shiv 的一些趣事”。
//zxx: 总之,github是目前最新最有谱的地方,有什么问题之类的就来这里吧~~标题的意思是维护人员希望大家可以提出点新颖的东西来激发其久违的激情与干劲。
HTML5 Shiv API
HTML5 Shiv以简单的插入式方案工作。在大多数情况下,没有必要去配置HTML5 Shiv或者使用HTML5 Shiv提供的方法。
html5.elements
选项
elements
选项为空格分隔的字符串或数组,其描述了完整的需要兼容的元素列表。
在引用html5shiv.js
之前配置elements
.
//创建一个全局的可选HTML5对象
window.html5 = {
'elements': 'mark section customelement'
};
在引用html5shiv.js
之后配置elements
.
//改变html5shiv可选对象
window.html5.elements = 'mark section customelement';
//重调用`shivDocument`方法
html5.shivDocument(document);
html5.shivCSS
如果shivCSS
被设置为true
, 则会给章节元素(如section, article等~)添加基本的些样式(大部分是display:block)。在大多数情况下,网页作者应该在正常的样式表中包括这些基本样式以确保旧的浏览器在没有JavaScript的时候支持(如FireFox 3.6)。
shivCSS
默认为true
, 可以被设置为false
, 只能在html5shiv.js
引用之前:
//创建一个全局的html5选项对象
window.html5 = {
'shivCSS': false
};
html5.createElement( nodeName [, document] )
html5.createElement
方法创建一个“光环”元素,即使shivMethods
设置为false
.
var container = html5.createElement('div');
//container被“猪脚光环”了,因此我们可以使用`innerHTML`添加HTML5元素。
container.innerHTML = '<section>This is a section</section>';
html5.createDocumentFragment( [document] )
html5.createDocumentFragment
方法创建一个“光环”的文档片段,即使shivMethods
设置为false
.
var fragment = html5.createDocumentFragment();
var container = document.createElement('div');
fragment.appendChild(container);
//fragment被“猪脚光环”了,因此我们可以使用`innerHTML`添加HTML5元素。
container.innerHTML = '<section>This is a section</section>';
HTML5 Shiv已知问题及限制
shivMethods
选项(覆盖document.createElement
)以及html5.createElement
创建元素,不是分离的,其公用父节点(另请参阅问题#64)。- 节点克隆问题目前HTML5 Shiv未处理。HTML5元素可以被动态创建,但是在所有情况下都不能被克隆。
- 打印版本的HTML5 Shiv在打印的时候不得不修改了打印样式以及整个DOM. 在复杂站点,或很多打印样式的情况下,可能会造成性能以及/或样式问题。一个可行的解决方案是HTML5 Shiv的htc-branch, 其使用了其他技术实现IE8下的打印样式。
其他的HTML5元素项目
- 最初的概念以及项目协作故事已经在“HTML5 Shiv的前世今生”中提及。
- Jon Neal的IEPP(IE print project), 解决了最初html5shiv的打印问题。其被并入了
html5shiv
. - Shimprove, 2010年4月,修补
cloneNode
以及createElement
,后来并入了html5shiv
. - innerShiv, 2010年8月JD Barlett推出,解决了DOM中动态添加HTML5元素问题。jQuery增加了支持,使得innerShiv显得多余,加上html5shiv解决了相同的问题,因此,这个项目就到头了~
- Google Code上html5shim和html5shiv站点由Remy Sharp维护,与本
html5shiv
项目有着完全一致的分发点。 - Modernizr被和
html5shiv
同样的人发展着,因此modernizr.com包含最新版本的任何创建的自定义。 html5shiv
repo现在包含针对上面库所寻找的所有边界情况的测试,无论在开发和生产中,都经过了广泛的测试。
html5shiv详细更新日志可访问。
为什么叫做shiv?
shiv这个术语来自John Resig, 其使用这个术语是因为其地方意思:一个尖锐的对象,就像刀那样的武器,针对IE浏览器的。现在,有点小改变的是John实际上拼写错误了,其本想使用shim这个词,在计算机用语中,表示一个兼容的应用环境。不过从后来也可以理解的解释来看,John是个众所周知的“顽童”。
以上为翻译全部,如果错误,欢迎指正。
本文为原创文章,转载请注明来自张鑫旭-鑫空间-鑫生活[http://www.zhangxinxu.com]
本文地址:http://www.zhangxinxu.com/wordpress/?p=3020
(本篇完)
- js面向数据编程(DOP)一点分享 (0.544)
- 小tips: JS DOM innerText和textContent的区别 (0.544)
- 盘点HTML字符串转DOM的各种方法及细节 (0.544)
- 我是如何实现electron的在线升级热更新功能的? (0.456)
- 纯CSS图片滤镜项目CSSgram简介 (0.456)
- HTML静态页面原型交付工具“魔卡”简介 (0.456)
- 巧用DOM API实现HTML字符的转义和反转义 (0.456)
- 一言难尽的registerProtocolHandler()方法 (0.456)
- JavaScript实现图片幻灯片滚动播放动画效果 (0.088)
- jQuery之addClasas与removeClass使用实例 (0.088)
- 表单序列化、规则分离下的复杂表单计算 (RANDOM - 0.088)
这玩意只是一个治标不治本啊 硬伤:canvas还是摆设
excanvas.js可以让IE支持简单的canvas操作,本质是封装了IE的vml