@joyzl/eno 1.2.0 → 1.2.2

package/README.md

@@ -1,7 +1,8 @@
 # eno
-易用、简洁、轻量且高效的HTML操作库。
+简单易用，性能卓越，自由灵活的WEB前端组件
+主要用于 JSON 与 HTML 操作交互的 JavaScript 方法库。
 
-[joyzl eno](http://eno.joyzl.com)
+[joyzl eno](http://eno.joyzl.net)
 
 ## 安装
 ``` cmd
@@ -13,544 +14,4 @@ import eno from '@joyzl/eno';
 ```
 
 ## 使用
-
-### eno.sets()
-
-eno.sets() 将数据对象（通常为JSON实例）设置到HTML标签显示。
-
-参数形式：
-* eno.sets(element, parameter);
-* eno.sets(selector, parameter);
-* eno.sets(element, selector, parameter);
-* eno.sets(element, parameter, converter);
-* eno.sets(element, selector, parameter, converter);
-
-参数含义：
-* element 元素实例/元素查找范围；
-* selector 选择器字符串；
-* parameter 数据对象/数据对象数组；
-* converter 转换函数 function(element, parameter, name){}；
-
-转换函数参数含义：
-* element 元素实例；
-* parameter 对象实例；
-* name 情形值；
-
-#### 单个对象设置到HTML显示
-
-将单个数据对象（例如从服务器获取的JSON对象）设置到HTML元素以显示数据。
-
-首先建立HTML标签元素如下所示：
-```html
-<div id="user">
-	<span name="realname"></span>
-	<span name="birthday"></span>
-</div>
-```
-
-将数据对象设置到HTML标签元素。
-```javascript
-let user = {
-	realname: "小明",
-	birthday: "1992-5-27"
-};
-let div = document.getElementById("user");
-eno.sets(div, user);
-```
-
-数据对象的字段值将根据HTML标签元素指定的name属性插入到标签中。
-```html
-<div id="user">
-	<span name="realname">小明</span>
-	<span name="birthday">1992-5-27</span>
-</div>
-```
-
-#### 多个对象设置到HTML显示
-
-将多个数据对象（例如从服务器获取的JSON对象数组）设置到HTML元素以显示数据；
-此时eno将自动克隆创建对应数量的HTML元素以对应多项数据。
-
-首先建立HTML标签元素如下所示：
-```html
-<div id="users">
-	<div>
-		<span name="realname"></span>
-		<span name="birthday"></span>
-	</div>
-</div>
-```
-
-将数据对象设置到HTML标签元素。
-```javascript
-let users = [{
-		realname: "小明",
-		birthday: "1992-5-27"
-	},
-	{
-		realname: "小王",
-		birthday: "1993-8-16"
-	}
-];
-eno.sets("#users", users);
-```
-
-数据对象的字段值将根据HTML标签元素指定的name属性插入到标签中；
-此时eno将 "#users" DIV 的子元素作为模板，自动克隆以显示多项数据。
-```html
-<div id="users">
-	<div>
-		<span name="realname">小明</span>
-		<span name="birthday">1992-5-27</span>
-	</div>
-	<div>
-		<span name="realname">小王</span>
-		<span name="birthday">1993-8-16</span>
-	</div>
-</div>
-```
-
-在相同元素实例多次执行eno.sets方法时，eno将自动维护对应的数量的子元素，以保持正确的显示；
-如果传入的对象数组为[]或null这将清除所有子元素，eno会通过隐藏以保留原始模板。
-
-#### 多个对象设置到HTML显示并指定模板
-
-通过模板&lt;template&gt;显示多个对象到HTML中具有更好的灵活性，eno将保留模板标签之外的HTML。
-```html
-<div id="users">
-	<div>
-		<span>用户列表</span>
-	</div>
-	<template>
-		<div>
-			<span name="realname"></span>
-			<span name="birthday"></span>
-		</div>
-	</template>
-</div>
-```
-
-执行eno.sets("#users",users)将得到如下HTML实例：
-```html
-<div id="users">
-	<div>
-		<span>用户列表</span>
-	</div>
-	<template>
-		<div>
-			<span name="realname"></span>
-			<span name="birthday"></span>
-		</div>
-	</template>
-	<div>
-		<span name="realname">小明</span>
-		<span name="birthday">1992-5-27</span>
-	</div>
-	<div>
-		<span name="realname">小王</span>
-		<span name="birthday">1993-8-16</span>
-	</div>
-</div>
-```
-eno根据"#users"中的&lt;template&gt;创建对应数量的HTML元素显示数据，
-并保留其它HTML标签（也保留&lt;template&gt;本身，因为此标签不会被显示）。
-
-#### 在HTML指示对象字段
-
-将对象通过HTML显示时，eno通过标签的"name"属性值确定对象字段（区分大小写）；
-属性值支持点语法分隔多级字段，例如："department.name"；
-
-eno确定对象字段后将根据标签类型执行默认的值设置：
-* input标签设置为value属性值；
-* img标签设置为src属性值；
-* 其它标签设置为内部文本(innerText)；
-
-```html
-<div id="users">
-	<template>
-		<div>
-			<img name="avatar"/>
-			<span name="realname"></span>
-			<span name="birthday"></span>
-			<span name="department.name"></span>
-		</div>
-	</template>
-</div>
-```
-```javascript
-let users = [{
-		realname: "小明",
-		birthday: "1992-5-27",
-		avatar: "okjniybu.png",
-		department: {
-			name: "A部"
-		}
-	},
-	{
-		realname: "小王",
-		birthday: "1993-8-16",
-		avatar: "likjudde.png",
-		department: {
-			name: "B部"
-		}
-	}
-];
-eno.sets("#users", users);
-```
-
-#### 自定义对象字段与HTML显示方式
-
-如果默认行为无法满足显示需求，例如根据状态字段更改颜色，
-可通过"case"属性值和自定义转换函数执行特殊处理；
-```html
-<div id="users">
-	<template>
-		<div>
-			<img case="url"/>
-			<span name="realname"></span>
-			<span name="birthday"></span>
-			<span name="department.name"></span>
-		</div>
-	</template>
-</div>
-```
-转换函数将在遇到的每一个"case"属性时触发，并传入三个参数
-分别为element表示"case"所在的元素实例，
-parameter表示当前数据对象，
-name指示"case"的值；
-```javascript
-let users = [...];
-eno.sets("#users", users, function(element, parameter, name){
-	if(name=="url"){
-		element.src = "http://joyzl.net/" + parameter.avatar;
-	}
-});
-```
-通过转换函数可以执行任何需要的自定义处理；
-但须注意的是，每个模板实例中的多个"case"都将调用转换函数，
-如果同时指定"name"属性，将在调用转换函数后执行默认行为。
-
-### eno.gets()
-
-从HTML元素获取用户数据以形成JSON对象实例。
-与eno.sets方法的行为正好相反，将从HTML中具有"name"属性的标签提取数据。
-
-参数形式：
-* eno.gets(element);
-* eno.gets(selector);
-* eno.gets(element, converter);
-* eno.gets(selector, converter);
-* eno.gets(element, selector, converter);
-
-参数含义：
-* element 元素实例；
-* selector 选择器字符串；
-* converter 转换函数 function(element, parameter, name){}；
-
-转换函数参数含义：
-* element 元素实例；
-* parameter 对象实例；
-* name 情形值；
-
-#### 从HTML中提取数据
-
-假设有以下HTML实例：
-```html
-<div id="user">
-	<span name="realname">小明</span>
-	<span name="birthday">1992-5-27</span>
-</div>
-```
-
-执行gets方法获取数据对象：
-```javascript
-let values = eno.gets(element);
-// values 实例字段如下
-// {
-//		realname: "小明",
-//		birthday: "1992-5-27"
-// }
-```
-eno.gets将普通标签获取内部普通文本内容(innetText)。
-
-#### 从表单中提取数据
-
-获取表单输入值，gets将识别传入参数是否表单。
-```html
-<form>
-	<input type="text" name="user" value="小张"/>
-	<input type="text" name="birthday" value="1982-10-30"/>
-</form>
-```
-
-执行gets方法获取form数据对象：
-```javascript
-let values = eno.gets(element);
-// values 实例字段如下
-// {
-//		realname: "小张",
-//		birthday: "1982-10-30"
-// }
-```
-eno.gets将表单标签获取控件值内容(control.value)。
-
-#### 自定义数据提取方式
-
-与eno.sets方法相同，eno.gets也支持同样参数的数据转换函数用于自定义提取方式。
-```javascript
-let values = eno.gets(element, function(element, parameter, name){
-	if(name=="url"){
-		parameter.avatar = element.src.replace("http://joyzl.net/","");
-	}
-});
-// values 实例字段如下
-// {
-//		realname: "小张",
-//		birthday: "1982-10-30",
-//		avatar: "okjniybu.png"
-// }
-```
-
-### eno.create()
-
-eno.create() 用于将字符串形式的HTML标签创建为HTML实例。
-
-参数形式：
-* eno.create(html);
-
-参数含义：
-* html 字符串；
-
-```javascript
-let element = eno.create("<div><a href='http://www.joyzl.com'>joyzl</a></div>");
-```
-
-注意：此时创建的标签实例未插入文档中，因此不会在浏览器网页呈现。
-
-### eno.append()
-
-eno.append() 用于将字符串形式的HTML标签创建为HTML实例，并插入文档指定的位置尾部。
-
-参数形式：
-* eno.append(element, html);
-* eno.append(selector, html);
-
-参数含义：
-* element 元素实例；
-* selector 选择器字符串；
-* html 字符串；
-
-```javascript
-// 添加到<body>中尾部
-let element1 = eno.append("<div><a href='http://www.joyzl.com'>joyzl</a></div>");
-
-// 添加到指定元素中尾部
-let parent = document.getElementById("main");
-let element2 = eno.append(parent, "<div><a href='http://www.joyzl.com'>joyzl</a></div>");
-```
-
-### eno.replace()
-
-eno.replace() 用于将字符串形式的HTML标签创建为HTML实例，并替换指定的元素。
-
-参数形式：
-* eno.replace(element, html);
-* eno.replace(selector, html);
-
-参数含义：
-* element 元素实例；
-* selector 选择器字符串；
-* html 字符串；
-
-```javascript
-let element = document.getElementById("customer-define");
-element = eno.replace(element, "<div><a href='http://www.joyzl.com'>joyzl</a></div>");
-```
-
-### eno.select()
-
-eno.select() 用于在文档或指定范围查找元素。
-
-参数形式：
-* eno.select(selector);
-* eno.select(element, selector);
-
-参数含义：
-* element 元素实例；
-* selector 选择器字符串；
-
-```javascript
-// 在整个文档中查找
-let element = eno.select("#id");
-
-// 在指定元素中查找
-element = eno.select(element, "div");
-```
-
-支持标准的CSS选择器字符串，如果匹配多个元素将以数组返回结果集，仅匹配单个时仅返回匹配的元素实例。 
-
-### eno.remove()
-
-eno.remove() 用于移除文档中的指定元素。
-
-参数形式：
-* eno.remove(element);
-* eno.remove(selector);
-* eno.remove(element, selector);
-
-参数含义：
-* element 元素实例；
-* selector 选择器字符串；
-
-### eno.hide()
-
-eno.hide() 用于隐藏元素。
-
-参数形式：
-* eno.hide(element);
-* eno.hide(selector);
-* eno.hide(element, selector);
-
-参数含义：
-* element 元素实例；
-* selector 选择器字符串；
-
-### eno.show()
-
-eno.show() 用于显示元素。
-
-参数形式：
-* eno.show(element);
-* eno.show(selector);
-* eno.show(element, selector);
-
-参数含义：
-* element 元素实例；
-* selector 选择器字符串；
-
-### eno.toggle()
-
-eno.toggle() 用于切换元素显示或样式类。
-调用此方法仅指定元素或选择器参数，指定或匹配的元素将显示，其余同级元素全部隐藏；
-如果指定了样式类参数(applyClass, otherClass)，则匹配的元素将应用applyClass，其余同级元素应用otherClass样式类。
-
-参数形式：
-* eno.toggle(element);
-* eno.toggle(selector);
-* eno.toggle(element, selector);
-* eno.toggle(element, applyClass, otherClass);
-* eno.toggle(element, selector, applyClass, otherClass);
-
-参数含义：
-* element 元素实例；
-* selector 选择器字符串；
-* applyClass 当前元素应用的样式类；
-* otherClass 其它元素应用的样式类；
-
-此功能可用于层叠卡片显示切换或选中项高亮。
-
-
-
-### eno.bind()
-
-eno.bind() 用于绑定元素的事件。
-
-参数形式：
-* eno.bind(element, eventName, listener);
-* eno.bind(selector, eventName, listener);
-* eno.bind(element, selector, eventName, listener);
-
-参数含义：
-* element 元素实例；
-* selector 选择器字符串；
-* eventName 事件名称 "click"、"submit" ...；
-* listener 事件处理函数 function(event){}；
-
-处理函数参数含义：
-* this 元素实例；
-* event 事件实例；
-
-此方法的事件绑定与DOM API并无任何差异，其行为与Element.addEventListener()完全相同。
-
-#### eno.sets()的事件处理
-
-对于通过eno.sets()方法生成并填充值的元素，如果要监听每个元素的事件，
-可通过eno.bind()配合eno.entity()和eno.element()方法优化事件处理，而无须为每个子元素绑定事件；
-
-具体方法如下：
-+ 容器绑定所需事件；
-+ 在处理函数中通过eno.element()获取目标元素实例；
-+ 在处理函数中通过eno.entity()获取目标对象实例；
-
-示例代码：
-```javascript
-const element = eno.append(`
-<div id="users">
-	<div>
-		<span>用户列表</span>
-	</div>
-	<template>
-		<div>
-			<span name="realname"></span>
-			<span name="birthday"></span>
-		</div>
-	</template>
-</div>
-`);
-eno.bind(element,"click",function(event){
-	// 获取数据对象实例
-	eno.entity(event)
-	
-	// 获取元素对象实例
-	eno.element(event);
-});
-eno.sets(element,data);
-```
-
-### eno.entity()
-
-eno.entity() 用于获取通过eno.sets()方法填充元素的数据对象。
-
-参数形式：
-* eno.entity(event);
-* eno.entity(element);
-* eno.entity(element, selector);
-
-参数含义：
-* event 事件实例；
-* element 元素实例；
-* selector 选择器字符串；
-
-### eno.element()
-
-eno.element() 用于获取通过eno.sets()方法填充元素的实例。
-
-参数形式：
-* eno.element(event);
-
-参数含义：
-* event 事件实例；
-
-### eno.query()
-
-eno.query() 用于获取指定URL或当前URL中的查询字符串参数。
-
-参数形式：
-* eno.query();
-* eno.query(url);
-* eno.query(name);
-* eno.query(url, name);
-
-参数含义：
-* url 字符串，如果未指定则默认当前页面URL；
-* name 参数名字符串，区分大小写；
-
-
-```javascript
-// 从当前URL获取参数
-let token = eno.query("token");
-
-// 从指定URL获取参数
-let url = "http://www.joyzl.net/test?name=value";
-let value = eno.query(url, "name");
-```
+参考在线手册 [joyzl eno doc](http://eno.joyzl.net/document.html)

package/dist/joyzl-eno.js

@@ -1 +1 @@
-!function(e,t){"object"==typeof exports&&"object"==typeof module?module.exports=t():"function"==typeof define&&define.amd?define([],t):"object"==typeof exports?exports.eno=t():e.eno=t()}(self,(()=>(()=>{"use strict";var e={d:(t,n)=>{for(var r in n)e.o(n,r)&&!e.o(t,r)&&Object.defineProperty(t,r,{enumerable:!0,get:n[r]})},o:(e,t)=>Object.prototype.hasOwnProperty.call(e,t),r:e=>{"undefined"!=typeof Symbol&&Symbol.toStringTag&&Object.defineProperty(e,Symbol.toStringTag,{value:"Module"}),Object.defineProperty(e,"__esModule",{value:!0})}},t={};e.r(t),e.d(t,{default:()=>n});const n={create:l,append:function(e,t,n){if(1==arguments.length)n=l(e),e=document.body;else if(2==arguments.length)e=i(e),n=l(t);else{if(3!=arguments.length)return null;e=i(e,t),n=l(n)}return e&&n?(e.appendChild(r.content),n):null},replace:function(e,t,n){if(2==arguments.length)e=i(e),n=l(t);else{if(3!=arguments.length)return null;e=i(e,t),n=l(n)}if(e&&n){if(Array.isArray(n))for(let t=0;t<n.length;t++)n[t].classList.add(e.classList),e.style.cssText&&(n[t].style.cssText+=e.style.cssText);else n.classList.add(e.classList),e.style.cssText&&(n.style.cssText+=e.style.cssText);return e.replaceWith(r.content),n}return null},selects:f,select:i,remove:function(e,t){if(1==arguments.length)e=f(e);else{if(2!=arguments.length)return;e=f(e,t)}if(e&&e.length)for(let t=0;t<e.length;t++)e[t].remove()},show:function(e,t){if(1==arguments.length)e=f(e);else{if(2!=arguments.length)return;e=f(e,t)}if(e&&e.length)for(let t=0;t<e.length;t++)u(e[t])},hide:function(e,t){if(1==arguments.length)e=f(e);else{if(2!=arguments.length)return;e=f(e,t)}if(e&&e.length)for(let t=0;t<e.length;t++)o(e[t])},toggle:function(e,t,n,r){if(1==arguments.length){if(e=f(e))return c(e),e}else if(2==arguments.length){if(e=f(e,t))return c(e),e}else if(3==arguments.length){if(e=f(e))return toggleClasss(e,t,n),e}else if(4==arguments.length&&(e=f(e,t)))return function(e,t,n){let r,l,i;for(let f=0;f<e.length;f++){if(r=e[f],r.parentElement!==l)for(l=r.parentElement,i=0;i<l.children.length;i++)r!==l.children[i]&&(l.children[i].classList.remove(t),l.children[i].classList.add(n));r.classList.remove(n),r.classList.add(t)}}(e,n,r),e;return null},get:function(e,t,n=s){if(1==arguments.length)e=i(e);else if(2==arguments.length)t instanceof Function?(e=i(e),n=t):e=i(e,t);else{if(3!=arguments.length)return null;e=i(e,t)}if(e){let t={};return h(e,t,n),t}return null},gets:function(e,t,n=s){if(1==arguments.length)e=f(e);else if(2==arguments.length)t instanceof Function?(e=i(e),n=t):e=f(e,t);else{if(3!=arguments.length)return null;e=f(e,t)}if(e){let t,r=new Array;for(let l=0;l<e.length;l++)t={},h(e[l],t,n),r.push(t);return r}return null},set:function(e,t,n,r=s){if(2==arguments.length)e=i(e),n=t;else if(3==arguments.length)n instanceof Function?(e=i(e),r=n,n=t):e=i(e,t);else{if(4!=arguments.length)return null;e=i(e,t)}if(e)return d(e,n,r),e.__ENO_ENTITY=n,e},sets:function(e,t,n,r=s){if(2==arguments.length)e=i(e),n=t;else if(3==arguments.length)n instanceof Function?(e=i(e),r=n,n=t):e=i(e,t);else{if(4!=arguments.length)return null;e=i(e,t)}if(e){let t=0;if(void 0===e.__ENO_SETS){if(!e.childElementCount)return null;for(e.__ENO_SETS={},t=0;t<e.childElementCount;t++)if(e.children[t].content){e.__ENO_SETS.fragment=e.children[t].content,e.__ENO_SETS.before=++t,e.__ENO_SETS.after=e.childElementCount-t;break}if(void 0===e.__ENO_SETS.fragment){for(e.__ENO_SETS.fragment=new DocumentFragment;e.childElementCount>0;)e.__ENO_SETS.fragment.appendChild(e.children[0]);e.__ENO_SETS.before=0,e.__ENO_SETS.after=0}}if(n){let l,i;for(Array.isArray(n)||(n=[n]),t=0;t<n.length;t++)if(e.__ENO_SETS.before+t<e.childElementCount-e.__ENO_SETS.after)for(i=0;i<e.__ENO_SETS.fragment.childElementCount;i++)l=e.children[e.__ENO_SETS.before+t+i],d(l,n[t],r),l.__ENO_ENTITY=n[t];else{for(l=e.fragment.cloneNode(!0),i=0;i<l.childElementCount;i++)d(l.children[i],n[t],r),l.children[i].__ENO_ENTITY=n[t];e.insertBefore(l,e.children[e.__ENO_SETS.before+t*l.childElementCount])}for(i=t*e.__ENO_SETS.template.content.childElementCount,t=e.__ENO_SETS.before+e.__ENO_SETS.after;e.childElementCount>t+i;)e.children[e.__ENO_SETS.before+i].remove()}else for(t=e.__ENO_SETS.before+e.__ENO_SETS.after;e.childElementCount>t;)e.children[e.childElementCount-e.__ENO_SETS.after-1].remove();return e}},bind:function(e,t,n,r){if(3==arguments.length)e=f(e),r=n,n=t;else{if(4!=arguments.length)return null;e=f(e,t)}if(e&&e.length){for(let t=0;t<e.length;t++)e[t].addEventListener(n,r);return e}return null},entity:function(e,t){if(1==arguments.length)e=e.target?e.target:e.srcElement?e.srcElement:i(e);else{if(2!=arguments.length)return null;e=i(e,t)}for(;e;){if(e.__ENO_ENTITY)return e.__ENO_ENTITY;e=e.parentElement}return null},action,element:function(e){if(e)for(e=e.target?e.target:e.srcElement?e.srcElement:i(e);e;){if(e.userData)return e;e=e.parentElement}return null},query:function(e,t){if(0==arguments.length)e=window.location.search;else if(1==arguments.length)if(e.startsWith("http://")||e.startsWith("https://")){let t=e.indexOf("?");if(!(t>0))return null;e=e.substring(t)}else t=e,e=window.location.search;else{if(2!=arguments.length)return null;{let t=e.indexOf("?");if(!(t>0))return null;e=e.substring(t)}}if(e){if(!t){let t,n=1,r=1,l={};for(;r>=0&&r<e.length&&(n=e.indexOf("=",r),n>=0);){if(t=e.substring(n,r),n=++r,r=e.indexOf("&",r),!(r>=0)){l[t]=e.substring(n);break}l[t]=e.substring(n,r),n=++r}return l}{let n=e.indexOf(t);if(n>=0&&(n+=t.length,"="==e.charAt(n))){n++;let t=e.indexOf("&",n);return t>=0?e.substring(n,t):e.substring(n)}}}return null}},r=document.createElement("template");function l(e){if(e)if(e.trim){if(r.innerHTML=e,1==r.content.childElementCount)return r.content.firstElementChild;if(r.content.childElementCount>1)return Array.from(r.content.children)}else{if(e.tagName)return r.innerHTML="",r.appendChild(e),e;if(e instanceof DocumentFragment)return r.innerHTML="",r.appendChild(e),Array.from(r.content.children)}return null}function i(e,t){if(1==arguments.length){if(e.tagName)return e;if(e.trim)return document.querySelector(e);if(e.length)return e[0]}else if(2==arguments.length){if(e.tagName)return e.querySelector(t);if(e.trim&&(e=document.querySelector(e)))return e.querySelector(t)}return null}function f(e,t){if(1==arguments.length){if(e.tagName)return[e];if(e.trim){if((e=document.querySelectorAll(e)).length>0)return Array.from(e)}else if(e.length)return Array.from(e)}else if(2==arguments.length)if(e.tagName){if((e=e.querySelectorAll(t)).length>0)return Array.from(e)}else if(e.trim&&(e=document.querySelector(e))&&(e=e.querySelectorAll(t)).length>0)return Array.from(e);return null}function o(e){if(e.hidden){if(void 0!==e.__ENO_DISPLAY)return}else e.hidden=!0;e.__ENO_DISPLAY=e.style.display,e.style.display="none"}function u(e){e.hidden&&(e.hidden=!1,void 0!==e.__ENO_DISPLAY&&(e.style.display=e.__ENO_DISPLAY))}function c(e){let t,n,r;for(let l=0;l<e.length;l++){if(t=e[l],t.parentElement!==n)for(n=t.parentElement,r=0;r<n.children.length;r++)t!==n.children[r]&&o(n.children[r]);u(t)}}function s(e,t,n){}function h(e,t,n){let r=e.getAttribute("case");if(r&&r.length&&n(e,t,r),r=e.getAttribute("name"),r&&r.length&&(e.type?e.disabled||(void 0===e.checked||e.checked)&&a(t,r,e.value):e.src?a(t,r,e.src):a(t,r,e.innerText)),e.childElementCount)for(let r=0;r<e.children.length;r++)h(e.children[r],t,n)}function d(e,t,n){let r=e.getAttribute("case");if(r&&r.length&&n(e,t,r),r=e.getAttribute("name"),r&&r.length&&(e.type?void 0===e.checked?e.checked=e.value==_(t,r):e.value=g(_(t,r)):void 0!==e.src?(void 0===e.__ENO_SRC&&(e.__ENO_SRC=e.src),e.src=g(_(t,r)),0==e.src.length&&(e.src=e.__ENO_SRC)):(void 0===e.__ENO_TEXT&&(e.__ENO_TEXT=e.innerText,e.__ENO_TITLE=!e.title),e.innerText=g(_(t,r)),0==e.innerText.length&&(e.innerText=e.__ENO_TEXT),e.__ENO_TITLE&&(e.title=e.innerText))),e.childElementCount)for(let r=0;r<e.children.length;r++)d(e.children[r],t,n)}function _(e,t){t=t.split(".");for(let n=0;n<t.length&&e;n++)if(Array.isArray(e)){const r=new Array;for(let l=0;l<e.length;l++)e[l]&&r.push(e[l][t[n]]);e=r}else e=e[t[n]];return e}function a(e,t,n){t=t.split(".");let r=0;for(;r<t.length-1;r++)e=e[t[r]]?e[t[r]]:e[t[r]]={};void 0===e[t=t[r]]?e[t]=n:Array.isArray(e[t])?e[t].push(n):e[t]=[e[t],n]}function g(e){return Array.isArray(e)?e.join(","):null!=e?e.toString():""}return t})()));
+!function(e,t){"object"==typeof exports&&"object"==typeof module?module.exports=t():"function"==typeof define&&define.amd?define([],t):"object"==typeof exports?exports.eno=t():e.eno=t()}(self,(()=>(()=>{"use strict";var e={d:(t,n)=>{for(var r in n)e.o(n,r)&&!e.o(t,r)&&Object.defineProperty(t,r,{enumerable:!0,get:n[r]})},o:(e,t)=>Object.prototype.hasOwnProperty.call(e,t),r:e=>{"undefined"!=typeof Symbol&&Symbol.toStringTag&&Object.defineProperty(e,Symbol.toStringTag,{value:"Module"}),Object.defineProperty(e,"__esModule",{value:!0})}},t={};e.r(t),e.d(t,{default:()=>n});const n={create:l,append:function(e,t,n){if(1==arguments.length)n=l(e),e=document.body;else if(2==arguments.length)e=i(e),n=l(t);else{if(3!=arguments.length)return null;e=i(e,t),n=l(n)}return e&&n?(e.appendChild(r.content),n):null},replace:function(e,t,n){if(2==arguments.length)e=i(e),n=l(t);else{if(3!=arguments.length)return null;e=i(e,t),n=l(n)}if(e&&n){if(Array.isArray(n))for(let t=0;t<n.length;t++)n[t].classList.add(e.classList),e.style.cssText&&(n[t].style.cssText+=e.style.cssText);else n.classList.add(e.classList),e.style.cssText&&(n.style.cssText+=e.style.cssText);return e.replaceWith(r.content),n}return null},selects:f,select:i,remove:function(e,t){if(1==arguments.length)e=f(e);else{if(2!=arguments.length)return;e=f(e,t)}if(e&&e.length)for(let t=0;t<e.length;t++)e[t].remove()},show:function(e,t){if(1==arguments.length)e=f(e);else{if(2!=arguments.length)return;e=f(e,t)}if(e&&e.length)for(let t=0;t<e.length;t++)o(e[t])},hide:function(e,t){if(1==arguments.length)e=f(e);else{if(2!=arguments.length)return;e=f(e,t)}if(e&&e.length)for(let t=0;t<e.length;t++)u(e[t])},toggle:function(e,t,n,r){if(1==arguments.length){if(e=f(e))return c(e),e}else if(2==arguments.length){if(e=f(e,t))return c(e),e}else if(3==arguments.length){if(e=f(e))return s(e,t,n),e}else if(4==arguments.length&&(e=f(e,t)))return s(e,n,r),e;return null},get:function(e,t,n=h){if(1==arguments.length)e=i(e);else if(2==arguments.length)t instanceof Function?(e=i(e),n=t):e=i(e,t);else{if(3!=arguments.length)return null;e=i(e,t)}if(e){let t={};return a(e,t,n),t}return null},gets:function(e,t,n=h){if(1==arguments.length)e=f(e);else if(2==arguments.length)t instanceof Function?(e=f(e),n=t):e=f(e,t);else{if(3!=arguments.length)return null;e=f(e,t)}if(e){let t,r=new Array;for(let l=0;l<e.length;l++)t={},a(e[l],t,n),r.push(t);return r}return null},set:function(e,t,n,r=h){if(2==arguments.length)e=i(e),n=t;else if(3==arguments.length)n instanceof Function?(e=i(e),r=n,n=t):e=i(e,t);else{if(4!=arguments.length)return null;e=i(e,t)}if(e)return Array.isArray(n)&&(n=n[0]),_(e,n,r),e.__ENO_ENTITY=n,e},sets:function(e,t,n,r=h){if(2==arguments.length)e=i(e),n=t;else if(3==arguments.length)n instanceof Function?(e=i(e),r=n,n=t):e=i(e,t);else{if(4!=arguments.length)return null;e=i(e,t)}if(e){let t=0;if(void 0===e.__ENO_SETS){if(!e.childElementCount)return null;for(e.__ENO_SETS={},t=0;t<e.childElementCount;t++)if(e.children[t].content){e.__ENO_SETS.fragment=e.children[t].content,e.__ENO_SETS.before=++t,e.__ENO_SETS.after=e.childElementCount-t;break}if(void 0===e.__ENO_SETS.fragment){for(e.__ENO_SETS.fragment=new DocumentFragment;e.childElementCount>0;)e.__ENO_SETS.fragment.appendChild(e.children[0]);e.__ENO_SETS.before=0,e.__ENO_SETS.after=0}}if(n){let l,i;for(Array.isArray(n)||(n=[n]),t=0;t<n.length;t++)if(e.__ENO_SETS.before+t<e.childElementCount-e.__ENO_SETS.after)for(i=0;i<e.__ENO_SETS.fragment.childElementCount;i++)l=e.children[e.__ENO_SETS.before+t+i],_(l,n[t],r),l.__ENO_ENTITY=n[t];else{for(l=e.__ENO_SETS.fragment.cloneNode(!0),i=0;i<l.childElementCount;i++)_(l.children[i],n[t],r),l.children[i].__ENO_ENTITY=n[t];e.insertBefore(l,e.children[e.__ENO_SETS.before+t*l.childElementCount])}for(i=t*e.__ENO_SETS.fragment.childElementCount,t=e.__ENO_SETS.before+e.__ENO_SETS.after;e.childElementCount>t+i;)e.children[e.__ENO_SETS.before+i].remove()}else for(t=e.__ENO_SETS.before+e.__ENO_SETS.after;e.childElementCount>t;)e.children[e.childElementCount-e.__ENO_SETS.after-1].remove();return e}},bind:function(e,t,n,r){if(3==arguments.length)e=f(e),r=n,n=t;else{if(4!=arguments.length)return null;e=f(e,t)}if(e&&e.length){for(let t=0;t<e.length;t++)e[t].addEventListener(n,r);return e}return null},entity:function(e,t){if(1==arguments.length)e=e.target?e.target:e.srcElement?e.srcElement:i(e);else{if(2!=arguments.length)return null;e=i(e,t)}for(;e;){if(e.__ENO_ENTITY)return e.__ENO_ENTITY;e=e.parentElement}return null},element:function(e){if(e)for(e=e.target?e.target:e.srcElement?e.srcElement:i(e);e;){if(e.userData)return e;e=e.parentElement}return null},target:function(e,t,n){if(1==arguments.length)return e.target||e.srcElement;if(2==arguments.length){let n=e.target||e.srcElement;for(;n&&n!==e.currentTarget;){if(n.hasAttribute(t))return n;n=n.parentElement}}else if(3==arguments.length){let r=e.target||e.srcElement;for(;r&&r!==e.currentTarget;){if(r.getAttribute(t)==n)return r;r=r.parentElement}}return null},query:function(e,t){if(0==arguments.length)e=window.location.search;else if(1==arguments.length)if(e.startsWith("http://")||e.startsWith("https://")){let t=e.indexOf("?");if(!(t>0))return null;e=e.substring(t)}else t=e,e=window.location.search;else{if(2!=arguments.length)return null;{let t=e.indexOf("?");if(!(t>0))return null;e=e.substring(t)}}if(e){if(!t){let t,n=1,r=1,l={};for(;r>=0&&r<e.length&&(n=e.indexOf("=",r),n>=0);){if(t=e.substring(n,r),n=++r,r=e.indexOf("&",r),!(r>=0)){l[t]=e.substring(n);break}l[t]=e.substring(n,r),n=++r}return l}{let n=e.indexOf(t);if(n>=0&&(n+=t.length,"="==e.charAt(n))){n++;let t=e.indexOf("&",n);return t>=0?e.substring(n,t):e.substring(n)}}}return null}},r=document.createElement("template");function l(e){if(e)if(e.trim){if(r.innerHTML=e,1==r.content.childElementCount)return r.content.firstElementChild;if(r.content.childElementCount>1)return Array.from(r.content.children)}else{if(e.tagName)return r.innerHTML="",r.appendChild(e),e;if(e instanceof DocumentFragment)return r.innerHTML="",r.appendChild(e),Array.from(r.content.children)}return null}function i(e,t){if(1==arguments.length){if(e.tagName)return e;if(e.trim)return document.querySelector(e);if(e.length)return e[0]}else if(2==arguments.length){if(e.tagName)return e.querySelector(t);if(e.trim&&(e=document.querySelector(e)))return e.querySelector(t)}return null}function f(e,t){if(1==arguments.length){if(e.tagName)return[e];if(e.trim){if((e=document.querySelectorAll(e)).length>0)return Array.from(e)}else if(e.length)return Array.from(e)}else if(2==arguments.length)if(e.tagName){if((e=e.querySelectorAll(t)).length>0)return Array.from(e)}else if(e.trim&&(e=document.querySelector(e))&&(e=e.querySelectorAll(t)).length>0)return Array.from(e);return null}function u(e){if(e.hidden){if(void 0!==e.__ENO_DISPLAY)return}else e.hidden=!0;e.__ENO_DISPLAY=e.style.display,e.style.display="none"}function o(e){e.hidden&&(e.hidden=!1,void 0!==e.__ENO_DISPLAY&&(e.style.display=e.__ENO_DISPLAY))}function c(e){let t,n,r;for(let l=0;l<e.length;l++){if(t=e[l],t.parentElement!==n)for(n=t.parentElement,r=0;r<n.children.length;r++)t!==n.children[r]&&u(n.children[r]);o(t)}}function s(e,t,n){let r,l,i;for(let f=0;f<e.length;f++){if(r=e[f],r.parentElement!==l)for(l=r.parentElement,i=0;i<l.children.length;i++)r!==l.children[i]&&(l.children[i].classList.remove(t),l.children[i].classList.add(n));r.classList.remove(n),r.classList.add(t)}}function h(e,t,n){}function a(e,t,n){let r=e.getAttribute("case");if(r&&r.length&&n(e,t,r),r=e.getAttribute("name"),r&&r.length&&(e.type?e.disabled||("number"===e.type||"range"===e.type?isNaN(e.valueAsNumber)||d(t,r,e.valueAsNumber):"checkbox"===e.type||"radio"===e.type?e.checked&&d(t,r,e.value):e.value&&d(t,r,e.value)):e.src?d(t,r,e.src):d(t,r,e.innerText)),e.childElementCount)for(let r=0;r<e.children.length;r++)a(e.children[r],t,n)}function _(e,t,n){let r=e.getAttribute("case");if(r&&r.length&&n(e,t,r),r=e.getAttribute("name"),r&&r.length&&(e.type?"checkbox"===e.type||"radio"===e.type?e.checked=e.value==g(t,r):e.value=E(g(t,r)):void 0!==e.src?(void 0===e.__ENO_SRC&&(e.__ENO_SRC=e.src),e.src=E(g(t,r)),0==e.src.length&&(e.src=e.__ENO_SRC)):(void 0===e.__ENO_TEXT&&(e.__ENO_TEXT=e.innerText,e.__ENO_TITLE=!e.title),e.innerText=E(g(t,r)),0==e.innerText.length&&(e.innerText=e.__ENO_TEXT),e.__ENO_TITLE&&(e.title=e.innerText))),e.childElementCount)for(let r=0;r<e.children.length;r++)_(e.children[r],t,n)}function g(e,t){t=t.split(".");for(let n=0;n<t.length&&e;n++)if(Array.isArray(e)){const r=new Array;for(let l=0;l<e.length;l++)e[l]&&r.push(e[l][t[n]]);e=r}else e=e[t[n]];return e}function d(e,t,n){t=t.split(".");let r=0;for(;r<t.length-1;r++)e=e[t[r]]?e[t[r]]:e[t[r]]={};void 0===e[t=t[r]]?e[t]=n:Array.isArray(e[t])?e[t].push(n):e[t]=[e[t],n]}function E(e){return Array.isArray(e)?e.join(","):null!=e?e.toString():""}return t})()));

package/index.js

@@ -20,8 +20,8 @@ export default {
 
 	bind,
 	entity,
-	action,
 	element,
+	target,
 
 	query
 }
@@ -89,6 +89,7 @@ function append(element, selector, html) {
 	if (arguments.length == 2) {
 		// append(element,selector); 无效
 		// append(element,html);
+		// append(selector,html);
 		element = select(element);
 		html = create(selector);
 	} else
@@ -119,6 +120,7 @@ function append(element, selector, html) {
 function replace(element, selector, html) {
 	if (arguments.length == 2) {
 		// replace(element,html);
+		// replace(selector,html);
 		element = select(element);
 		html = create(selector);
 	} else
@@ -165,6 +167,7 @@ function select(element, selector) {
 	if (arguments.length == 1) {
 		// 仅指定1个参数
 		// select(element);
+		// select(selector);
 		if (element.tagName) {
 			return element;
 		} else
@@ -366,7 +369,7 @@ function toggle(element, selector, applyClass, otherClass) {
 		// toggle(element,applyClass,otherClass)
 		element = selects(element);
 		if (element) {
-			toggleClasss(element, selector, applyClass);
+			toggleClasses(element, selector, applyClass);
 			return element;
 		}
 	} else
@@ -497,7 +500,7 @@ function gets(element, selector, converter = defaultConverter) {
 		// gets(element,selector)
 		// gets(element,converter)
 		if (selector instanceof Function) {
-			element = select(element);
+			element = selects(element);
 			converter = selector;
 		} else {
 			element = selects(element, selector);
@@ -560,6 +563,10 @@ function set(element, selector, entity, converter = defaultConverter) {
 
 	if (element) {
 		// Object -> Element
+		if (Array.isArray(entity)) {
+			entity = entity[0];
+		}
+
 		setEntity(element, entity, converter);
 		element.__ENO_ENTITY = entity;
 		return element;
@@ -655,7 +662,7 @@ function sets(element, selector, entity, converter = defaultConverter) {
 					}
 				} else {
 					// 克隆新的元素(DocumentFragment)
-					node = element.fragment.cloneNode(true);
+					node = element.__ENO_SETS.fragment.cloneNode(true);
 					for (n = 0; n < node.childElementCount; n++) {
 						setEntity(node.children[n], entity[i], converter);
 						node.children[n].__ENO_ENTITY = entity[i];
@@ -664,7 +671,7 @@ function sets(element, selector, entity, converter = defaultConverter) {
 				}
 			}
 			// 移除多余元素
-			n = i * element.__ENO_SETS.template.content.childElementCount;
+			n = i * element.__ENO_SETS.fragment.childElementCount;
 			i = element.__ENO_SETS.before + element.__ENO_SETS.after;
 			while (element.childElementCount > i + n) {
 				element.children[element.__ENO_SETS.before + n].remove();
@@ -696,9 +703,22 @@ function getEntity(element, entity, converter) {
 	if (name && name.length) {
 		if (element.type) {
 			// 所有控件具有type属性
+			// 所有控件具有disabled属性
+			// <select> <textarea> 没有checked属性，其余均有
 			if (!element.disabled) {
-				if (element.checked === undefined || element.checked) {
-					setValue(entity, name, element.value);
+				if (element.type === "number" || element.type === "range") {
+					if (!isNaN(element.valueAsNumber)) {
+						setValue(entity, name, element.valueAsNumber);
+					}
+				} else
+				if (element.type === "checkbox" || element.type === "radio") {
+					if (element.checked) {
+						setValue(entity, name, element.value);
+					}
+				} else {
+					if (element.value) {
+						setValue(entity, name, element.value);
+					}
 				}
 			}
 		} else
@@ -732,7 +752,7 @@ function setEntity(element, entity, converter) {
 	if (name && name.length) {
 		if (element.type) {
 			// 所有控件具有type属性
-			if (element.checked === undefined) {
+			if (element.type === "checkbox" || element.type === "radio") {
 				// Radio / Check
 				element.checked = element.value == getValue(entity, name);
 			} else {
@@ -861,6 +881,7 @@ function text(value) {
 function bind(element, selector, eventName, listener) {
 	if (arguments.length == 3) {
 		// bind(element,eventName,listener);
+		// bind(selector,eventName,listener);
 		element = selects(element);
 		listener = eventName;
 		eventName = selector;
@@ -946,6 +967,40 @@ function element(e) {
 	return null;
 }
 
+/**
+ * 获取具有指定属性的事件目标
+ * @param {Event} event
+ * @param {String} name
+ * @param {String} value
+ */
+function target(event, name, value) {
+	if (arguments.length == 1) {
+		// target(event);
+		return event.target || event.srcElement;
+	} else
+	if (arguments.length == 2) {
+		// target(event, name);
+		let element = event.target || event.srcElement;
+		while (element && element !== event.currentTarget) {
+			if (element.hasAttribute(name)) {
+				return element;
+			}
+			element = element.parentElement;
+		}
+	} else
+	if (arguments.length == 3) {
+		// target(event, name, value);
+		let element = event.target || event.srcElement;
+		while (element && element !== event.currentTarget) {
+			if (element.getAttribute(name) == value) {
+				return element;
+			}
+			element = element.parentElement;
+		}
+	}
+	return null;
+}
+
 /**
  * 获取 URL 中的 Query String 指定名称的参数值或包含所有参数的实体对象
  * @param {String} url URL

package/package.json

@@ -1,6 +1,6 @@
 {
 	"name": "@joyzl/eno",
-	"version": "1.2.0",
+	"version": "1.2.2",
 	"description": "Easy Node Object",
 	"main": "dist/joyzl-eno.js",
 	"module": "index.js",
@@ -24,7 +24,7 @@
 	"bugs": {
 		"url": "https://github.com/JoyLinks/eno/issues"
 	},
-	"homepage": "https://github.com/JoyLinks/eno#readme",
+	"homepage": "http://eno.joyzl.net",
 	"devDependencies": {
 		"webpack": "^5.91.0",
 		"webpack-cli": "^5.1.4"