cell 介绍
cell一个由自驱动、自构建的Web应用程序框架。 Cell只有一个设计目标:简单,易于学习和使用。
cell的使用
<html>
<script src="https://www.celljs.org/cell.js"></script>
<script>
var el = {
$cell: true,
style: "font-family: Helvetica; font-size: 14px;",
$components: [
{
$type: "input",
type: "text",
placeholder: "Type something and press enter",
style: "width: 100%; outline:none; padding: 5px;",
$init: function(e) { this.focus() },
onkeyup: function(e) {
if (e.keyCode === 13) {
document.querySelector("#list")._add(this.value);
this.value = "";
}
}
},
{
$type: "ol",
id: "list",
_items: [],
$components: [],
_add: function(val) { this._items.push(val) },
$update: function() {
this.$components = this._items.map(function(item) {
return { $type: "li",$text: item }
})
}
}
]
}
</script>
</html>
代码中需要注意的几件事:
没有要继承和扩展的框架类。
没有API方法调用。
没有html正文标记。
我们所拥有的只是一个类似jsON的变量。
DOM只是在没有运行任何功能的情况下构建自己。
GitHub:https://github.com/intercellular/cell
网站描述:一个自驱动的Web应用程序框架
cell
小编说
版权声明:本文内容由互联网用户自发贡献,该文观点与技术仅代表作者本人。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如发现本站有涉嫌侵权/违法违规的内容, 请发送邮件至 dio@foxmail.com 举报,一经查实,本站将立刻删除。