理解使用 JavaScript 构建 Metro 应用

从 Windows 7 升级到 Windows 8 Consumer Preview 后，会导致 Microsoft Visual Studio 11 Express Beta for Windows 8 无法申请开发者证书。

Upgrade from Windows 7 can cause the “We couldn’t get your developer license” error 

解决方法在这里：http://t.cn/zOVOlmS 其实就是重装

 

这里是中文教程

使用 JavaScript 创建你的第一个 Metro 风格应用：http://msdn.microsoft.com/zh-cn/library/windows/apps/br211385

 

每个 HTML 都需要引用 WinJS和样式

<link href="//Microsoft.WinJS.0.6/css/ui-dark.css" rel="stylesheet">
<script src="//Microsoft.WinJS.0.6/js/base.js"></script>
<script src="//Microsoft.WinJS.0.6/js/ui.js"></script>

适用于 Metro 风格应用的 JavaScript 项目模板

http://msdn.microsoft.com/zh-cn/library/windows/apps/hh758331.aspx

 

default.html　　该文件最先加载，并为内容主体（其中每个页面都加载进主窗体）提供标记。

default.css 为内容主体页面和应用整体指定 CSS 样式

default.js 指定当启动应用时的应用的行为

// For an introduction to the Split template, see the following documentation:
// http://go.microsoft.com/fwlink/?LinkID=232447
(function () {
    "use strict";

    var app = WinJS.Application;

    app.onactivated = function (eventObject) {
        if (eventObject.detail.kind === Windows.ApplicationModel.Activation.ActivationKind.launch) {
            if (eventObject.detail.previousExecutionState !== Windows.ApplicationModel.Activation.ApplicationExecutionState.terminated) {
                // TODO: This application has been newly launched. Initialize 
                // your application here.
            } else {
                // TODO: This application has been reactivated from suspension. 
                // Restore application state here.
            }
            WinJS.UI.processAll();
        }
    };

    app.oncheckpoint = function (eventObject) {
        // TODO: This application is about to be suspended. Save any state
        // that needs to persist across suspensions here. You might use the 
        // WinJS.Application.sessionState object, which is automatically
        // saved and restored across suspension. If you need to complete an
        // asynchronous operation before your application is suspended, call
        // eventObject.setPromise(). 
    };

    app.start();
})();

　　

Metro应用的生命周期

应用的生命周期在应用启动时开始，并在应用关闭时结束。项目模板包还一个用于管理应用生命周期的通用模式。

 

default.html文件被设置为每个模板的起始页面。default.html对应的JavaScript文件包含以下对WinJS.Application.start的调用，该调用会启动应用事件的分发。

 

http://www.infoq.com/cn/news/2009/12/ecmascript5

严格模式的引入，目的在于避免ECMAScript应用中通常的代码问题。这是通过在单元（脚本或函数）上指定一句话来达到的：

"use strict;"
这句话不会对已有的运行时产生什么影响，但版本是5的新运行时就会为整个脚本（如果这句话定义在脚本开头）或者单个函数（如果定义在函数的开头）打开严格模式。这样就允许计划中的既有代码对严格模式和非严格模式的混合使用。那么，严格模式意味着什么呢？

变量在使用前必须声明。换句话说，i=3这下就是个运行时错误了；需要var i=3（如果i在做作用域里面没有定义过）
eval变成保留字，而从eval引入的新变量不再有效，因此eval("var i=3"); print(i);现在会抛出错误。
不再使用八进制；所以010就是十，不再是八。
如果configurable被设置成false，delete就不能使用在参数、函数、变量或者其他属性上。
一般会带来错误的with语句，将不再使用，会被认为是语法错误。
函数不再能使用具有相同名称的重复参数。
对象不再能使用具有相同名称的重复属性。
arguments和caller变量不再可变。
对全局对象的访问将会是运行时错误。

 

右侧博客园的文章一直不能正常显示，一直在找代码的原因，纠结了好久。

toStaticHTML的方法，<a>标签中有target="_blank"会被替换掉。

再一个就是无法显示的图像也会导致无法正常显示文章，用下面的正则替换掉后即可。

staticContent = staticContent.replace(/<img src=.*aggbug.*>/, '');