CSS 新语法(目前还没有浏览器支持)
#!html5 /* declaration *//* head title */
head { title: 'Hello world'; }
/* html element */
head link {
rel: stylesheet;
type: 'text/css';
href: 'mystyle.css';
}
/* <script scr="sample.js" /> */
script {
type: text/javascript;
src: sample.js;
}
/* <h1>My first Heading</h1> */
/* 也可以写 html 因为有时候 更简洁 */
h1 { content: 'My first Heading'; }
p{ content: 'My first paragraph'; }
a {
href: 'http://www/w3schools.com';
content: This is a link;
}
/* default save css to an file named michael.css */
button {
type: button;
onclick: myfunction;
content: Click me;
}
/* 开始一个脚本 */
form {
method: post;
action: xxx.htm;
onsubmit: alert('My first Javascript');
}
/* myfunction is an function behavior */
&myfunction p {
content: 'This is a paragraph';
} 顶上去!顶上去! 本帖最后由 Perlvim 于 2012-10-26 22:34 编辑
最近一直在做一个编译器，将 css 扩展后的语法，解析成 内联 css 和 jQuery 的格式。
以下是一个 css 的格式：p {
class: classname;
onclik: function;
}
/* 没有匿名函数名称更清晰 */
&function p.classname {
width: 100;
}转换成的 js 代码如下：$(document).ready(function() {
$("p").click(function() {
$(".classname").css("width", "100");
});
});这种语法更简洁，也更容易理解。
我打算在Less-css 基础上扩展 html 的结构和内容部分和javascript 的行为部分。
这个项目是用Perl实现的解析器。
代码地址：
页:
[1]