@whitesev/domutils 1.4.8 → 1.5.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/dist/index.amd.js +62 -13
- package/dist/index.amd.js.map +1 -1
- package/dist/index.cjs.js +62 -13
- package/dist/index.cjs.js.map +1 -1
- package/dist/index.esm.js +62 -13
- package/dist/index.esm.js.map +1 -1
- package/dist/index.iife.js +62 -13
- package/dist/index.iife.js.map +1 -1
- package/dist/index.system.js +62 -13
- package/dist/index.system.js.map +1 -1
- package/dist/index.umd.js +62 -13
- package/dist/index.umd.js.map +1 -1
- package/dist/types/src/DOMUtilsCommonUtils.d.ts +10 -0
- package/dist/types/src/types/DOMUtilsEvent.d.ts +1 -0
- package/package.json +1 -1
- package/src/DOMUtils.ts +31 -11
- package/src/DOMUtilsCommonUtils.ts +24 -0
- package/src/types/DOMUtilsEvent.d.ts +1 -0
package/dist/index.iife.js
CHANGED
|
@@ -58,6 +58,46 @@ var DOMUtils = (function () {
|
|
|
58
58
|
isShow(element) {
|
|
59
59
|
return Boolean(element.getClientRects().length);
|
|
60
60
|
},
|
|
61
|
+
/**
|
|
62
|
+
* 获取安全的html
|
|
63
|
+
*/
|
|
64
|
+
getSafeHTML(text) {
|
|
65
|
+
// @ts-ignore
|
|
66
|
+
if (globalThis.trustedTypes) {
|
|
67
|
+
// @ts-ignore
|
|
68
|
+
const policy = globalThis.trustedTypes.createPolicy("safe-innerHTML", {
|
|
69
|
+
createHTML: (html) => html,
|
|
70
|
+
});
|
|
71
|
+
return policy.createHTML(text);
|
|
72
|
+
}
|
|
73
|
+
else {
|
|
74
|
+
return text;
|
|
75
|
+
}
|
|
76
|
+
},
|
|
77
|
+
/**
|
|
78
|
+
* 在CSP策略下设置innerHTML
|
|
79
|
+
* @param $el 元素
|
|
80
|
+
* @param text 文本
|
|
81
|
+
*/
|
|
82
|
+
setSafeHTML($el, text) {
|
|
83
|
+
// 创建 TrustedHTML 策略(需 CSP 允许)
|
|
84
|
+
try {
|
|
85
|
+
$el.innerHTML = text;
|
|
86
|
+
}
|
|
87
|
+
catch (error) {
|
|
88
|
+
// @ts-ignore
|
|
89
|
+
if (globalThis.trustedTypes) {
|
|
90
|
+
// @ts-ignore
|
|
91
|
+
const policy = globalThis.trustedTypes.createPolicy("safe-innerHTML", {
|
|
92
|
+
createHTML: (html) => html,
|
|
93
|
+
});
|
|
94
|
+
$el.innerHTML = policy.createHTML(text);
|
|
95
|
+
}
|
|
96
|
+
else {
|
|
97
|
+
throw new Error("trustedTypes is not defined");
|
|
98
|
+
}
|
|
99
|
+
}
|
|
100
|
+
},
|
|
61
101
|
/**
|
|
62
102
|
* 用于显示元素并获取它的高度宽度等其它属性
|
|
63
103
|
* @param element
|
|
@@ -1036,7 +1076,7 @@ var DOMUtils = (function () {
|
|
|
1036
1076
|
super(option);
|
|
1037
1077
|
}
|
|
1038
1078
|
/** 版本号 */
|
|
1039
|
-
version = "
|
|
1079
|
+
version = "2025.3.2";
|
|
1040
1080
|
attr(element, attrName, attrValue) {
|
|
1041
1081
|
let DOMUtilsContext = this;
|
|
1042
1082
|
if (typeof element === "string") {
|
|
@@ -1093,7 +1133,7 @@ var DOMUtils = (function () {
|
|
|
1093
1133
|
let DOMUtilsContext = this;
|
|
1094
1134
|
let tempElement = DOMUtilsContext.windowApi.document.createElement(tagName);
|
|
1095
1135
|
if (typeof property === "string") {
|
|
1096
|
-
tempElement
|
|
1136
|
+
DOMUtilsContext.html(tempElement, property);
|
|
1097
1137
|
return tempElement;
|
|
1098
1138
|
}
|
|
1099
1139
|
if (property == null) {
|
|
@@ -1104,6 +1144,10 @@ var DOMUtils = (function () {
|
|
|
1104
1144
|
}
|
|
1105
1145
|
Object.keys(property).forEach((key) => {
|
|
1106
1146
|
let value = property[key];
|
|
1147
|
+
if (key === "innerHTML") {
|
|
1148
|
+
DOMUtilsContext.html(tempElement, value);
|
|
1149
|
+
return;
|
|
1150
|
+
}
|
|
1107
1151
|
tempElement[key] = value;
|
|
1108
1152
|
});
|
|
1109
1153
|
Object.keys(attributes).forEach((key) => {
|
|
@@ -1272,7 +1316,7 @@ var DOMUtils = (function () {
|
|
|
1272
1316
|
html = html.innerHTML;
|
|
1273
1317
|
}
|
|
1274
1318
|
if ("innerHTML" in element) {
|
|
1275
|
-
element
|
|
1319
|
+
DOMUtilsCommonUtils.setSafeHTML(element, html);
|
|
1276
1320
|
}
|
|
1277
1321
|
}
|
|
1278
1322
|
}
|
|
@@ -1378,7 +1422,12 @@ var DOMUtils = (function () {
|
|
|
1378
1422
|
return Reflect.get(element, propName);
|
|
1379
1423
|
}
|
|
1380
1424
|
else {
|
|
1381
|
-
|
|
1425
|
+
if (element instanceof Element && propName === "innerHTML") {
|
|
1426
|
+
DOMUtilsContext.html(element, propValue);
|
|
1427
|
+
}
|
|
1428
|
+
else {
|
|
1429
|
+
Reflect.set(element, propName, propValue);
|
|
1430
|
+
}
|
|
1382
1431
|
}
|
|
1383
1432
|
}
|
|
1384
1433
|
/**
|
|
@@ -1594,7 +1643,7 @@ var DOMUtils = (function () {
|
|
|
1594
1643
|
}
|
|
1595
1644
|
function elementAppendChild(ele, text) {
|
|
1596
1645
|
if (typeof content === "string") {
|
|
1597
|
-
ele.insertAdjacentHTML("beforeend", text);
|
|
1646
|
+
ele.insertAdjacentHTML("beforeend", DOMUtilsCommonUtils.getSafeHTML(text));
|
|
1598
1647
|
}
|
|
1599
1648
|
else {
|
|
1600
1649
|
ele.appendChild(text);
|
|
@@ -1640,7 +1689,7 @@ var DOMUtils = (function () {
|
|
|
1640
1689
|
return;
|
|
1641
1690
|
}
|
|
1642
1691
|
if (typeof content === "string") {
|
|
1643
|
-
element.insertAdjacentHTML("afterbegin", content);
|
|
1692
|
+
element.insertAdjacentHTML("afterbegin", DOMUtilsCommonUtils.getSafeHTML(content));
|
|
1644
1693
|
}
|
|
1645
1694
|
else {
|
|
1646
1695
|
let $firstChild = element.firstChild;
|
|
@@ -1677,7 +1726,7 @@ var DOMUtils = (function () {
|
|
|
1677
1726
|
return;
|
|
1678
1727
|
}
|
|
1679
1728
|
if (typeof content === "string") {
|
|
1680
|
-
element.insertAdjacentHTML("afterend", content);
|
|
1729
|
+
element.insertAdjacentHTML("afterend", DOMUtilsCommonUtils.getSafeHTML(content));
|
|
1681
1730
|
}
|
|
1682
1731
|
else {
|
|
1683
1732
|
let $parent = element.parentElement;
|
|
@@ -1716,7 +1765,7 @@ var DOMUtils = (function () {
|
|
|
1716
1765
|
return;
|
|
1717
1766
|
}
|
|
1718
1767
|
if (typeof content === "string") {
|
|
1719
|
-
element.insertAdjacentHTML("beforebegin", content);
|
|
1768
|
+
element.insertAdjacentHTML("beforebegin", DOMUtilsCommonUtils.getSafeHTML(content));
|
|
1720
1769
|
}
|
|
1721
1770
|
else {
|
|
1722
1771
|
let $parent = element.parentElement;
|
|
@@ -1776,7 +1825,7 @@ var DOMUtils = (function () {
|
|
|
1776
1825
|
});
|
|
1777
1826
|
return;
|
|
1778
1827
|
}
|
|
1779
|
-
element
|
|
1828
|
+
DOMUtilsContext.html(element, "");
|
|
1780
1829
|
}
|
|
1781
1830
|
/**
|
|
1782
1831
|
* 获取元素相对于文档的偏移坐标(加上文档的滚动条)
|
|
@@ -1986,10 +2035,10 @@ var DOMUtils = (function () {
|
|
|
1986
2035
|
if (typeof duration !== "number" || duration <= 0) {
|
|
1987
2036
|
throw new TypeError("duration must be a positive number");
|
|
1988
2037
|
}
|
|
1989
|
-
if (typeof callback !== "function" && callback !==
|
|
2038
|
+
if (typeof callback !== "function" && callback !== undefined) {
|
|
1990
2039
|
throw new TypeError("callback must be a function or null");
|
|
1991
2040
|
}
|
|
1992
|
-
if (typeof styles !== "object" || styles ===
|
|
2041
|
+
if (typeof styles !== "object" || styles === undefined) {
|
|
1993
2042
|
throw new TypeError("styles must be an object");
|
|
1994
2043
|
}
|
|
1995
2044
|
if (Object.keys(styles).length === 0) {
|
|
@@ -2048,7 +2097,7 @@ var DOMUtils = (function () {
|
|
|
2048
2097
|
element = element;
|
|
2049
2098
|
// 创建一个新的div元素,并将wrapperHTML作为其innerHTML
|
|
2050
2099
|
let wrapper = DOMUtilsContext.windowApi.document.createElement("div");
|
|
2051
|
-
wrapper
|
|
2100
|
+
DOMUtilsContext.html(wrapper, wrapperHTML);
|
|
2052
2101
|
let wrapperFirstChild = wrapper.firstChild;
|
|
2053
2102
|
// 将要包裹的元素插入目标元素前面
|
|
2054
2103
|
let parentElement = element.parentElement;
|
|
@@ -2144,7 +2193,7 @@ var DOMUtils = (function () {
|
|
|
2144
2193
|
}
|
|
2145
2194
|
function parseHTMLByCreateDom() {
|
|
2146
2195
|
let tempDIV = DOMUtilsContext.windowApi.document.createElement("div");
|
|
2147
|
-
tempDIV
|
|
2196
|
+
DOMUtilsContext.html(tempDIV, html);
|
|
2148
2197
|
if (isComplete) {
|
|
2149
2198
|
return tempDIV;
|
|
2150
2199
|
}
|