EXTJS4.0 EXT文件目录,本地加载文档,命名规范
1.从http://www.sencha.com/products/extjs
下载最新的EXTJS框架文件,我下载的版本为EXT-4.0.7-GPL,此版本在IE7/IE8下面运行效率不高,在EXT-4.1中会解决。
2.解压缩文件,得到以下目录
docs目录中是说明文档
examples目录中是EXTJS的例子
locale目录中是本地化文件
resources目录中是样式文件
src目录中是EXTJS控件文件
3.使用EXTJS4
在页面头部,引用EXTJS样式文件,EXTJS文件,本地化文件
<head>
<meta http-equiv="Content-Type" content="text/html; charset=gb2312" />
<title>学习EXTJS4</title>
<!--EXTJS样式文件-->
<link rel="stylesheet" type="text/css" href="ext-4.0.7-gpl/ext-4.0.7-gpl/resources/css/ext-all.css"/>
<!--EXTJS文件-->
<script type="text/javascript" src="ext-4.0.7-gpl/ext-4.0.7-gpl/ext-all.js"></script>
<!--EXTJS本地化文件,会将EXTJS中的提示信息等自动转换为简体中文-->
<script type="text/javascript" src="ext-4.0.7-gpl/ext-4.0.7-gpl/locale/ext-lang-zh_CN.js"></script>
</head>
注:EXTJS文件的区别:
ext-all.js:包含所有的EXTJS框架文件,已经混淆
ext-all-debug.js:包含所有的EXTJS框架文件,没有混淆
ext-all-dev.js:包含所有的EXTJS框架文件,没有混淆,且包含调试信息
ext.js:仅包含能让EXTJS运行的最小集合,已经混淆
ext-debug.js:仅包含能让EXTJS运行的最小集合,没有混淆
ext-dev.js:仅包含能让EXTJS运行的最小集合,没有混淆,且包含调试信息
bootstrap.js:自动加载ext-all.js或者ext-all-debug.js,在以下情况下会加载ext-all-debug.js
1.当前主机名是本地
2.当前主机是使用IPV4地址
3.Current protocol is a file(不好意思,我不知道怎么翻译,请会的朋友说一下)
4.其他情况下自动加载ext-all.js
4.具体实例:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=gb2312" />
<title>学习EXTJS4</title>
<!--EXTJS样式文件-->
<link rel="stylesheet" type="text/css" href="ext-4.0.7-gpl/ext-4.0.7-gpl/resources/css/ext-all.css"/>
<!--EXTJS文件-->
<script type="text/javascript" src="ext-4.0.7-gpl/ext-4.0.7-gpl/ext-all.js"></script>
<!--EXTJS本地化文件,会将EXTJS中的提示信息等自动转换为简体中文-->
<script type="text/javascript" src="ext-4.0.7-gpl/ext-4.0.7-gpl/locale/ext-lang-zh_CN.js"></script>
<script type="text/javascript">
<!--在页面加载完成后调用JS代码-->
Ext.onReady(function(){
<!--弹出提示信息框-->
Ext.Msg.alert('ext','学习EXTJS')
});
</script>
</head>
<body>
</body>
</html>
效果
5.智能提示:
在visual studio 2010中,只要在页面引用了EXTJS文件(bootstrap.js除外),就会出现智能提示,在js文件中,先引用ext.js文件,就会出现智能提示
6.命名规范
类名如果有多段构成,第一段的首字母大写,最后一段的首字母大写,中间的字母小写
例子:
7.ext-base.js
这个版本有bootstrap.js代替了