onsen-ui 介绍

示例

Onsen UI是一个开放源代码框架,可帮助您构建具有类似本机性能的混合应用程序。它可以与几个著名的JavaScript框架一起使用,例如AngularJS(1&2),ReactJS和jQuery。

在项目中加载OnsenUI就像在index.html文件中编写一些标准的HTML标签一样容易:

<!doctype html>
    <html lang="en">
      <head>
        <meta charset="utf-8">
        <!-- load Onsen structure CSS file -->
        <link rel="stylesheet" href="lib/onsen/css/onsenui.css"/>
        <!-- load Onsen theme CSS file -->
        <link rel="stylesheet" href="lib/onsen/css/onsen-css-components.css"/>
        <!-- load Onsen main Javascript file -->
        <script xx_src="lib/onsen/js/onsenui.js"></script>
        <script>
          ons.ready(function() {
            // 初始化代码在这里
          });
        </script>
      </head>
      <body>
        <ons-navigator>
          <ons-page>
            Hello World!
          </ons-page>
        </ons-navigator>
      </body>
    </html>

ons.ready函数是可以安全地告诉我们何时完成Onsen UI初始化的主要函数。然后,您可以使用任何OnsenUI组件。