ph-utils 0.1.0 → 0.1.6

package/lib/dom.d.ts

@@ -32,6 +32,37 @@ export declare function transform(element: HTMLElement, value: string): void;
  * @param {HTMLElement} element   添加事件的节点
  * @param {string}      listener  事件名称
  * @param {function}    event     事件处理函数
- * @param {boolean}     once      是否是只运行一次的处理函数
+ * @param {boolean}     onceOrConfig  是否是只运行一次的处理函数或者配置，其中 eventFlag 为 string，如果配置该项，则表明为委托事件
  */
-export declare function on(element: HTMLElement, listener: string, event: (e?: Event) => void, once?: boolean): void;
+export declare function on(element: HTMLElement, listener: string, fn: (e: Event, target?: HTMLElement, flag?: string) => void, once?: boolean | {
+    once?: boolean;
+    eventFlag?: string;
+}): void;
+/**
+ * 设置或获取节点的 innerHTML 属性
+ * @param element
+ * @param htmlstr 可选，如果传递该参数，则表示设置；否则表示获取
+ * @returns
+ */
+export declare function html(element: HTMLElement, htmlstr?: string): string;
+/**
+ * 设置或获取节点的 textContent 属性
+ * @param element
+ * @param textstr 可选，如果传递该参数，则表示设置；否则表示获取
+ * @returns
+ */
+export declare function text(element: HTMLElement, textstr?: string): string;
+/**
+ * 节点列表遍历
+ * @param elems
+ * @param fn 遍历到节点时的回调，回调第一个参数为遍历到的节点，第2个参数为 index；如果回调函数返回 true，则会终止遍历(break)
+ */
+export declare function iterate(elems: NodeList, fn: (el: HTMLElement, index: number) => any): void;
+/**
+ * 设置或获取节点 data-* 属性
+ * @param elem
+ * @param key data- 后面跟随的值
+ * @param value 如果传递该值表示获取；否则表示设置
+ * @returns
+ */
+export declare function attr(elem: HTMLElement, key: string, value?: string): string;

package/lib/dom.js

@@ -54,8 +54,91 @@ export function transform(element, value) {
  * @param {HTMLElement} element   添加事件的节点
  * @param {string}      listener  事件名称
  * @param {function}    event     事件处理函数
- * @param {boolean}     once      是否是只运行一次的处理函数
+ * @param {boolean}     onceOrConfig  是否是只运行一次的处理函数或者配置，其中 eventFlag 为 string，如果配置该项，则表明为委托事件
  */
-export function on(element, listener, event, once = false) {
-    element.addEventListener(listener, event, { once });
+export function on(element, listener, fn, once = false) {
+    let eventExtra = {};
+    if (typeof once === 'boolean') {
+        eventExtra.once = once;
+    }
+    else {
+        eventExtra = once;
+    }
+    if (eventExtra.eventFlag != null) {
+        element.setAttribute(eventExtra.eventFlag, '__stop__');
+        element.addEventListener(listener, (e) => {
+            let target = e.target;
+            let flag = '';
+            do {
+                flag = target.getAttribute(eventExtra.eventFlag) || '';
+                if (flag === '') {
+                    target = target.parentNode;
+                }
+            } while (flag === '');
+            if (flag !== '__stop__') {
+                fn(e, target, flag);
+            }
+        }, eventExtra);
+    }
+    else {
+        element.addEventListener(listener, fn, eventExtra);
+    }
+}
+/**
+ * 设置或获取节点的 innerHTML 属性
+ * @param element
+ * @param htmlstr 可选，如果传递该参数，则表示设置；否则表示获取
+ * @returns
+ */
+export function html(element, htmlstr) {
+    if (htmlstr == null) {
+        return element.innerHTML;
+    }
+    else {
+        element.innerHTML = htmlstr;
+        return undefined;
+    }
+}
+/**
+ * 设置或获取节点的 textContent 属性
+ * @param element
+ * @param textstr 可选，如果传递该参数，则表示设置；否则表示获取
+ * @returns
+ */
+export function text(element, textstr) {
+    if (textstr == null) {
+        return element.textContent;
+    }
+    else {
+        element.textContent = textstr;
+        return undefined;
+    }
+}
+/**
+ * 节点列表遍历
+ * @param elems
+ * @param fn 遍历到节点时的回调，回调第一个参数为遍历到的节点，第2个参数为 index；如果回调函数返回 true，则会终止遍历(break)
+ */
+export function iterate(elems, fn) {
+    for (let i = 0, len = elems.length; i < len; i++) {
+        let r = fn(elems[i], i);
+        if (r === true) {
+            break;
+        }
+    }
+}
+/**
+ * 设置或获取节点 data-* 属性
+ * @param elem
+ * @param key data- 后面跟随的值
+ * @param value 如果传递该值表示获取；否则表示设置
+ * @returns
+ */
+export function attr(elem, key, value) {
+    if (value != null) {
+        elem.setAttribute('data-' + key, value);
+    }
+    else {
+        return elem.getAttribute('data-' + key);
+    }
 }

package/package.json

@@ -5,7 +5,7 @@
   "module": "lib/index_m.js",
   "types": "lib/index.d.ts",
   "browser": "lib/index_m.js",
-  "version": "0.1.0",
+  "version": "0.1.6",
   "repository": {
     "type": "git",
     "url": "git+https//gitee.com/towardly/ph.git",