CSSS! 嵌入标准CSS并遵守CSS语法规则,受限于CSS语法，脚本并不使用分号分隔语句，
也不会使用大括号表示语句块，而是使用逗号分隔语句，使用分号结束语法块。
一、标志识 标志符可以使用英文字母, '-', '_' 或者 '$'符号,在这些后面可以附加数字， 注意CSS允许横线作为标志符的一部分，这与其他编程语言不同，如果你需要用横线表示操作符，例如负号，那么清添加空格以区别。
二、 关键字 CSSS! 支持下面的关键字 true表示逻辑真，false表示逻辑否，null表示空值，
而self表示自身，这里的self可不是aardio中表示当前名字空间的self对象，
实际上他更象aardio中表示自身的this或者owner对象。在CSSS!脚本中，
self指当前触发事件的节点（类似javascript中的this对象)
三、 操作符- < > <= == != >= && ||+ - * / % ^ | &
HTMLayout以后版本计划增加的操作符
四、三元操作符
这个语法的作用类似条件判断语句, 也有点象aardio中的三元操作符（区别是在CSSS!中使用#号，而不是类似 aardio或C++中的冒号，当然原因也很简单，冒号被CSS语法占用了) - self:value > 12 ?( self:current = true, self.scroll-to-view());
上面这句代码是指，如果当前节点的值大于12，那么选中当前节点( 改变current状态)，并且滚动到视图范围。
五、 类据类型
CSSS! 变量用到的类型如下 ：
null - 空值;
boolean 逻辑值，两个可选值 true 或 false;
integer - 32位整数值;
float - 64bit浮点值(实际上这里指的是aardio或C++中的double类型);
string - UNICODE字符串;
object - DOM节点对象(引用);
object-set - DOM节点对象的集合，函数 $() 返回这样的类型.
function-reference - CSSS!中定义的函数
六、 字面值
支持整数，浮点小数，文本, 长度单位，以及正则表达式等字面量 :
- 整数格式 -> [0-9]+ | '0x' [0-9A-Fa-f]+ | ''' character ''' | key-code-literal
- 浮点数格式 -> [0-9]+ '.' [0-9]+浮点数格式 -> [0-9]+ '.' 'e'|'E' '+'|'-' [0-9]+
- 文本字面量 -> '"' [.]* '"'
- 正则字面量 -> '/' <single line regular expression> ['/ig'] ';'
- 长度字面量 -> <integer-literal> | <float-literal> immediately followed by one of: 'pt' | 'px' | 'pc' | '%' | 'em' | 'ex' | 'in' | 'cm' | 'mm'
而文本需要放在双引号中。正则字面量则与javascrip;类似，至于长度大小等可以使用px(像素) pt(点)等单位，与CSS相同。
七、键盘代码字面量
键盘代码放在单引号中，可以是单个英文字母，也可以是下面的值： - 'RETURN' | 'LEFT' | 'RIGHT' | 'UP' | 'DOWN' | 'PRIOR' | 'NEXT' | 'TAB' | 'HOME' | 'END' | 'DELETE' | 'INSERT' | 'BACK'
如果按下组合键，例如 Ctrl+X \则在键名前加上 '^'. 字面量使用示范: - 34 - 表示普通整数
- 0xAFED1234 - 表示十六进制整数
- 1.52 - 表示浮点数
- 1.e2 - 表示浮点数
- 1.e-2 - 浮点数"Hello world!" - 字符串
- 12pt - 表示12象素.
- 'A' - 表示A的键盘代码，实际是一个数值
- key-on!: key-code() == '^A'? ... # // Ctrl+A 组合键
- key-code() == '^NEXT'? ... ; // Ctrl+PgDown 组合键
八、 注释语法
注释语句被忽略不会被编译，类似aardio的注释语法有两种格式:
单行注释以斜杠开头:
- '//' <text-no-crlf> end-of-line
九、 语句
CSSS! 脚本使用逗号 ','分隔语句，
语句块以分号 ';'.结束 ，下面是支持的语法规则:
9.1)、 赋值语句:9.2) 、 变量声明:9.3) 、 语句块 语句块是一系列使用逗号分隔的语句，语法规则如下： - '(' <expression> [, <expression>]* ')'
9.4) 、 条件语句
语法规则: - <logical-expresion> '?' <when-true-expression> [ '#' <when-false-expression> ]
CSSS! 的条件判断语句格式很简单,
类似 Javascript或aardio中 的 三元操作符 … ? … : … 组合，区别是用#号代替了冒号: 或者:
9.5) 、 循环
不支持循环，但是函数可以支持尾递归调用.
9.6) 、 Return语句 return 语句用在函数中返回一个值: - return <expression-or-value-to-return>
9.7) 、 For each, 枚举语句
语法规则如下：- <object-set> '->' <reference-to-function-with-single-parameter>
枚举通常被用于处理元素集合,格式如下:
集合 -> @(参数名) 操作语句 aardio中类似的遍历集合的代码如下：
for 局部变量名 in 集合{ }
.
范例:- input.number {
- value-changed! :
- total = 0,
- $(input.number) -> @(el) total = total + el:value,
- $1(td#total):value = total;
- }
上面代码的解释: 设页面上有一个HTML节点 <input class="number"> 在他的值发生改变量触发下面的操作:
定义一个变量 total 并且初始化他的值为 0,
定义一个函数 @(el) total = total + el:value,
枚举所有匹配CSS选择器 input.number 的节点，并执行->操作符后面指定的函数,
将total 的值赋于第一个匹配CSS选择器 td#total.的节点
十、访问DOM节点的属性、状态值、CSS样式
10.1)、 可以使用成员操作符圆点访问节点的属性:
例如对于当前节点: <input type="text"> 有下面的脚本代码: 将会获取节点的type属性并赋值给变量 t.
10.2)、 节点的状态使用冒号作为成员操作符:
支持的CSS状态储如: :hover, :active, :link, :checked, :current, etc.
在 CSSS! 中有如下状态可在执行时使用: | | | 元素DOM节点对象的值( 注意在CSSS!中 value 是作为一个状态值来访问，不是属性值，是以不能写为 ele.value, 而应当改用冒号写为 ele:value ), 对于输入框这个值为输入的文本. 其他元素为内部的文本. | | 元素在子元素的序号. 取值从 1 开始到 self.parent().children() | ele:hover ele:active ele:empty ele:readonly ele:disabled ele:focusable | 部分CSSS!中常用的布尔型状态. (true/false) |
更多节点状态属性请参考官方文档：http://www.terrainformatica.com/htmlayout/csss!-dom-object.whtm
10.3)、 CSS 属性使用两个冒号'::' 作为成员操作符:
下面是一个范例，在定时器中逐渐的将对象改变为透明状态。 - self::opacity = self::opacity + 0.1 #
- return cancel;
十一、Self对象
在脚本事件中表示当前节点
.
十二、Cancel
这个关键字是专用于return语句，以终止事件继续传递r.
十三、函数
CSSS! 支持匿名函数定义
13.1 定义函数
对于一般的函数, 定义的格式如下:
- foo = @( a, b ) c = a + b, return c
类似于aardio中类似的定义函数的代码如下： - foo = function( a, b ) {
- c = a + b; return c;
- } <font color="rgb(0,0,0)"><font>
- </font></font>
调用函数比较简单,下面的脚本调用函数foo()，传入参数1,2，并将返回值赋值给变量bar:
| 
发表于 2012-6-7 00:39:47
发表于 2012-6-7 21:50:26
