ph-utils 0.1.0 → 0.1.1
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/lib/dom.d.ts +28 -0
- package/lib/dom.js +58 -0
- package/package.json +1 -1
package/lib/dom.d.ts
CHANGED
|
@@ -35,3 +35,31 @@ export declare function transform(element: HTMLElement, value: string): void;
|
|
|
35
35
|
* @param {boolean} once 是否是只运行一次的处理函数
|
|
36
36
|
*/
|
|
37
37
|
export declare function on(element: HTMLElement, listener: string, event: (e?: Event) => void, once?: boolean): void;
|
|
38
|
+
/**
|
|
39
|
+
* 设置或获取节点的 innerHTML 属性
|
|
40
|
+
* @param element
|
|
41
|
+
* @param htmlstr 可选，如果传递该参数，则表示设置；否则表示获取
|
|
42
|
+
* @returns
|
|
43
|
+
*/
|
|
44
|
+
export declare function html(element: HTMLElement, htmlstr?: string): string;
|
|
45
|
+
/**
|
|
46
|
+
* 设置或获取节点的 textContent 属性
|
|
47
|
+
* @param element
|
|
48
|
+
* @param textstr 可选，如果传递该参数，则表示设置；否则表示获取
|
|
49
|
+
* @returns
|
|
50
|
+
*/
|
|
51
|
+
export declare function text(element: HTMLElement, textstr?: string): string;
|
|
52
|
+
/**
|
|
53
|
+
* 节点列表遍历
|
|
54
|
+
* @param elems
|
|
55
|
+
* @param fn 遍历到节点时的回调，回调第一个参数为遍历到的节点，第2个参数为 index；如果回调函数返回 true，则会终止遍历(break)
|
|
56
|
+
*/
|
|
57
|
+
export declare function iterate(elems: NodeList, fn: (el: HTMLElement, index: number) => any): void;
|
|
58
|
+
/**
|
|
59
|
+
* 设置或获取节点 data-* 属性
|
|
60
|
+
* @param elem
|
|
61
|
+
* @param key data- 后面跟随的值
|
|
62
|
+
* @param value 如果传递该值表示获取；否则表示设置
|
|
63
|
+
* @returns
|
|
64
|
+
*/
|
|
65
|
+
export declare function attr(elem: HTMLElement, key: string, value?: string): string;
|
package/lib/dom.js
CHANGED
|
@@ -59,3 +59,61 @@ export function transform(element, value) {
|
|
|
59
59
|
export function on(element, listener, event, once = false) {
|
|
60
60
|
element.addEventListener(listener, event, { once });
|
|
61
61
|
}
|
|
62
|
+
/**
|
|
63
|
+
* 设置或获取节点的 innerHTML 属性
|
|
64
|
+
* @param element
|
|
65
|
+
* @param htmlstr 可选，如果传递该参数，则表示设置；否则表示获取
|
|
66
|
+
* @returns
|
|
67
|
+
*/
|
|
68
|
+
export function html(element, htmlstr) {
|
|
69
|
+
if (htmlstr == null) {
|
|
70
|
+
return element.innerHTML;
|
|
71
|
+
}
|
|
72
|
+
else {
|
|
73
|
+
element.innerHTML = htmlstr;
|
|
74
|
+
return undefined;
|
|
75
|
+
}
|
|
76
|
+
}
|
|
77
|
+
/**
|
|
78
|
+
* 设置或获取节点的 textContent 属性
|
|
79
|
+
* @param element
|
|
80
|
+
* @param textstr 可选，如果传递该参数，则表示设置；否则表示获取
|
|
81
|
+
* @returns
|
|
82
|
+
*/
|
|
83
|
+
export function text(element, textstr) {
|
|
84
|
+
if (textstr == null) {
|
|
85
|
+
return element.textContent;
|
|
86
|
+
}
|
|
87
|
+
else {
|
|
88
|
+
element.textContent = textstr;
|
|
89
|
+
return undefined;
|
|
90
|
+
}
|
|
91
|
+
}
|
|
92
|
+
/**
|
|
93
|
+
* 节点列表遍历
|
|
94
|
+
* @param elems
|
|
95
|
+
* @param fn 遍历到节点时的回调，回调第一个参数为遍历到的节点，第2个参数为 index；如果回调函数返回 true，则会终止遍历(break)
|
|
96
|
+
*/
|
|
97
|
+
export function iterate(elems, fn) {
|
|
98
|
+
for (let i = 0, len = elems.length; i < len; i++) {
|
|
99
|
+
let r = fn(elems[i], i);
|
|
100
|
+
if (r === true) {
|
|
101
|
+
break;
|
|
102
|
+
}
|
|
103
|
+
}
|
|
104
|
+
}
|
|
105
|
+
/**
|
|
106
|
+
* 设置或获取节点 data-* 属性
|
|
107
|
+
* @param elem
|
|
108
|
+
* @param key data- 后面跟随的值
|
|
109
|
+
* @param value 如果传递该值表示获取；否则表示设置
|
|
110
|
+
* @returns
|
|
111
|
+
*/
|
|
112
|
+
export function attr(elem, key, value) {
|
|
113
|
+
if (value != null) {
|
|
114
|
+
elem.setAttribute('data-' + key, value);
|
|
115
|
+
}
|
|
116
|
+
else {
|
|
117
|
+
return elem.getAttribute('data-' + key);
|
|
118
|
+
}
|
|
119
|
+
}
|