var ctx = $('#canvas')[0].getContext("2d");
ctx.fillStyle = "#00A308";
ctx.beginPath();
ctx.arc(220, 220, 50, 0, Math.PI*2, true);
ctx.closePath();
ctx.fill();
MDC文档:https://developer.mozilla.org/en/Canvas_tutorial
支持:Firefox 1.5+, Safari 2.0+, Chrome 1.0+, Opera 9.0+
替代/过渡:excanvas.js http://code.google.com/p/explorercanvas/
SVG
w3c标准:http://www.w3.org/TR/SVG12/
IBM DW教程:http://www.ibm.com/developerworks/cn/views/xml/tutorials.jsp?cv_doc_id=84896
支持:Firefox 1.5+, Safari 3.0+, Chrome 1.0+, Opera 9.0+
替代/过渡:raphael.js http://raphaeljs.com/
XMLHttpRequest 2
主要是增加跨域能力以及请求过程中的事件
w3c标准:http://www.w3.org/TR/XMLHttpRequest2/
MDC文档:https://developer.mozilla.org/En/Using_XMLHttpRequest#Monitoring_progress
XDomainRequest (XDR)
MSDN文档:http://msdn.microsoft.com/en-us/library/cc288060(VS.85).aspx
支持:Firefox 3.5+(实现了部分), IE 8.0+(实现了部分)
Access Control
千呼万唤的跨域访问控制,目前firefox3.5和ie8有一些不同,ie8搞的XDR和XDM我也不知道是不是准备提交给w3c标准化的东西……
Access-Control-Allow-Origin: http://foo.example
w3c标准:http://www.w3.org/TR/cors/
MDC文档:https://developer.mozilla.org/En/HTTP_Access_Control
Cross-document Messaging (XDM)
MSDN文档:http://msdn.microsoft.com/en-us/library/cc197057(VS.85).aspx
支持:Firefox 3.5+, IE8.0+
E4X (ECMA-357)
Firefox和ActionScript3早就实现了的东西……不过其实现在json这么流行,有没有E4X好像都无所谓了~(瞎说的,其实在js代码里直接写dom对象而不是html字符串,会方便很多)
MDC文档:https://developer.mozilla.org/en/E4X
支持:Firefox 1.5+
ECMAScript 5 Native JSON
原生的JSON支持,速度和安全性都比eval强一百倍亚一百倍,另外要注意Douglas Crockford的json2.js是一个用js实现的js解释器,所以安全性更好
JSON.parse( text, translate )
JSON.stringify( obj, translate )
String.prototype.toJSON
Boolean.prototype.toJSON
Number.prototype.toJSON
Date.prototype.toJSON
MDC文档:http://blog.mozilla.com/webdev/2009/02/12/native-json-in-firefox-31/
MSDN文档:http://blogs.msdn.com/ie/archive/2008/09/10/native-json-in-ie8.aspx
支持:Firefox 3.5+, IE8+
替代/过渡:json2.js http://www.json.org/json2.js
ECMAScript 5 Array Extras
js1.6里实现的数组方法,主要是forEach, map, fliter这几个函数式编程里非常重要的方法,还有反向查询
Array.prototype.indexOf( str )
Array.prototype.lastIndexOf( str )
Array.prototype.every( fn )
Array.prototype.some( fn )
Array.prototype.filter( fn )
Array.prototype.forEach( fn )
Array.prototype.map( fn )
MDC文档:https://developer.mozilla.org/en/New_in_JavaScript_1.6#Array_extras
支持:Firefox2.0+, Safari 3.0+, Google Chrome 1.0+, Opera 9.5+
替代/过渡:都可以通过扩展Array.prototype来模拟
ECMAScript 5 isArray()
区分数组和对象
Array.isArray([]); // true
支持:无
替代/过渡:Array.isArray = function(a){ return Object.prototype.toString.call(a) === “[object Array]”;};
ECMAScript 5 Object
用GOOGLE I/O演讲里的话来说:更鲁棒(robust)的对象系统
Object.getPrototypeOf( obj )
约翰同学的讲解:http://ejohn.org/blog/objectgetprototypeof/
支持:Firefox3.5
替代/过渡:object.__proto__ 或 object.constructor.prototype
Object.create( proto, props ) //克隆或继承对象
Object.keys( obj ) //数据结构的映射
Object.getOwnPropertyNames( obj )
Object.preventExtensions( obj ) //不能添加新属性
Object.isExtensible( obj )
Object.seal( obj ) //不能删除和修改属性的配置,不能添加新属性
Object.isSealed( obj )
Object.freeze( obj ) //不能删除和修改属性的配置,不能添加新属性,不能写属性
Object.isFrozen( obj )
约翰同学的讲解:http://ejohn.org/blog/ecmascript-5-objects-and-properties/
支持:无
替代/过渡:Object.create和Object.keys可以自己实现