本文主要是介绍ExtJs5.0 入门 编写第一个网页Hello World,希望对大家解决编程问题提供一定的参考价值,需要的开发者们随着小编来一起学习吧!
此文章借鉴官网官方文档http://docs.sencha.com/extjs/5.0/getting_started/welcome_to_extjs.html。
首先下载extjs5.0,下载地址http://cdn.sencha.io/ext/gpl/ext-5.0.0-gpl.zip ,然后解压。
首先你新建一个index.html,然后包含如下内容:
<!DOCTYPE html>
<html>
<head>
<title>Welcome to Ext JS!</title>
<link rel="stylesheet" type="text/css" href="/home/steven/ExtJsDemo/ext-5.0.0/build/packages/ext-theme-neptune/build/resources/ext-theme-neptune-all.css">
<script type="text/javascript" src="/home/steven/ExtJsDemo/ext-5.0.0/build/ext-all.js"></script>
<script type="text/javascript" src="/home/steven/ExtJsDemo/ext-5.0.0/build/packages/ext-theme-neptune/build/ext-theme-neptune.js"></script>
<script type ="text/javascript" src="app.js"></script>
</head>
<body></body>
</html>
其中将上面所有的/home/steven/ExtJsDemo/ext-5.0.0换成你的ext5.0安装目录,因为我的是/home/steven/ExtJsDemo/ext-5.0.0
然后在和index.html同一目录下,新建一个app.js文件,包含如下内容:
Ext.application({
name : 'MyApp',
launch : function() {
Ext.create('Ext.Panel', {
renderTo : Ext.getBody(),
width : 200,
height : 150,
bodyPadding : 5,
title : 'Hello World',
html : 'Hello <b>World</b>...'
});
}
});
最后用浏览器打开index.html,就会看到ExtJs的效果。
这篇关于ExtJs5.0 入门 编写第一个网页Hello World的文章就介绍到这儿,希望我们推荐的文章对编程师们有所帮助!