wip: dynamic data

1 files changed, 19 insertions, 4 deletions

diff --git a/ka.js b/ka.js
index 9d5efc9..3aeef69 100644
--- a/ka.js
+++ b/ka.js
@@ -4,7 +4,20 @@ function el$Attr(name, value) {
   this.setAttribute(name, value);
   return this;
 }
-function el$OnClick(callback) {
+function el$Attrs(attrs) {
+  for (const [attr, value] of Object.entries(attrs||{})) {
+    this.$attr(attr, value);
+  }
+  return this;
+}
+function el$Cls(cls) {
+  return this.$attr("class", cls);
+}
+function el$Value(value) {
+  this.value = value;
+  return this;
+}
+function el$Click(callback) {
   this.onclick = callback;
   return this;
 }
@@ -12,7 +25,10 @@ function tag(name, attrs, ...children) {
   const el = doc.createElement(name);
   el.attr = elAttr;
   el.$attr = el$Attr;
-  el.$onclick = el$OnClick;
+  el.$attrs = el$Attrs;
+  el.$cls = el$Cls;
+  el.$value = el$Value;
+  el.$click = el$Click;
   for (const child of children) {
     el.appendChild((typeof(child) === 'string') ? doc.createTextNode(child) : child);
   }
@@ -22,13 +38,12 @@ function tag(name, attrs, ...children) {
   return el;
 }
 
-const TRIVIAL = "h1,h2,h3,p,a,div,span,select";
+const TRIVIAL = "h1,h2,h3,p,a,div,span,select,table,tr,td";
 for (let name of TRIVIAL.split(",")) {
     window[name] = (...children) => tag(name, null, ...children);
 }
 
 var ahref = (href, ...children) => tag("a", {href}, ...children);
-var divcls = (klass, ...children) => tag("div", {class: klass}, ...children);
 var img = (src) => tag("img", {src});
 var input = (type) => tag("input", {type});