@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.umd.js CHANGED
@@ -61,6 +61,46 @@
61
61
  isShow(element) {
62
62
  return Boolean(element.getClientRects().length);
63
63
  },
64
+ /**
65
+ * 获取安全的html
66
+ */
67
+ getSafeHTML(text) {
68
+ // @ts-ignore
69
+ if (globalThis.trustedTypes) {
70
+ // @ts-ignore
71
+ const policy = globalThis.trustedTypes.createPolicy("safe-innerHTML", {
72
+ createHTML: (html) => html,
73
+ });
74
+ return policy.createHTML(text);
75
+ }
76
+ else {
77
+ return text;
78
+ }
79
+ },
80
+ /**
81
+ * 在CSP策略下设置innerHTML
82
+ * @param $el 元素
83
+ * @param text 文本
84
+ */
85
+ setSafeHTML($el, text) {
86
+ // 创建 TrustedHTML 策略(需 CSP 允许)
87
+ try {
88
+ $el.innerHTML = text;
89
+ }
90
+ catch (error) {
91
+ // @ts-ignore
92
+ if (globalThis.trustedTypes) {
93
+ // @ts-ignore
94
+ const policy = globalThis.trustedTypes.createPolicy("safe-innerHTML", {
95
+ createHTML: (html) => html,
96
+ });
97
+ $el.innerHTML = policy.createHTML(text);
98
+ }
99
+ else {
100
+ throw new Error("trustedTypes is not defined");
101
+ }
102
+ }
103
+ },
64
104
  /**
65
105
  * 用于显示元素并获取它的高度宽度等其它属性
66
106
  * @param element
@@ -1039,7 +1079,7 @@
1039
1079
  super(option);
1040
1080
  }
1041
1081
  /** 版本号 */
1042
- version = "2024.12.4";
1082
+ version = "2025.3.2";
1043
1083
  attr(element, attrName, attrValue) {
1044
1084
  let DOMUtilsContext = this;
1045
1085
  if (typeof element === "string") {
@@ -1096,7 +1136,7 @@
1096
1136
  let DOMUtilsContext = this;
1097
1137
  let tempElement = DOMUtilsContext.windowApi.document.createElement(tagName);
1098
1138
  if (typeof property === "string") {
1099
- tempElement.innerHTML = property;
1139
+ DOMUtilsContext.html(tempElement, property);
1100
1140
  return tempElement;
1101
1141
  }
1102
1142
  if (property == null) {
@@ -1107,6 +1147,10 @@
1107
1147
  }
1108
1148
  Object.keys(property).forEach((key) => {
1109
1149
  let value = property[key];
1150
+ if (key === "innerHTML") {
1151
+ DOMUtilsContext.html(tempElement, value);
1152
+ return;
1153
+ }
1110
1154
  tempElement[key] = value;
1111
1155
  });
1112
1156
  Object.keys(attributes).forEach((key) => {
@@ -1275,7 +1319,7 @@
1275
1319
  html = html.innerHTML;
1276
1320
  }
1277
1321
  if ("innerHTML" in element) {
1278
- element.innerHTML = html;
1322
+ DOMUtilsCommonUtils.setSafeHTML(element, html);
1279
1323
  }
1280
1324
  }
1281
1325
  }
@@ -1381,7 +1425,12 @@
1381
1425
  return Reflect.get(element, propName);
1382
1426
  }
1383
1427
  else {
1384
- Reflect.set(element, propName, propValue);
1428
+ if (element instanceof Element && propName === "innerHTML") {
1429
+ DOMUtilsContext.html(element, propValue);
1430
+ }
1431
+ else {
1432
+ Reflect.set(element, propName, propValue);
1433
+ }
1385
1434
  }
1386
1435
  }
1387
1436
  /**
@@ -1597,7 +1646,7 @@
1597
1646
  }
1598
1647
  function elementAppendChild(ele, text) {
1599
1648
  if (typeof content === "string") {
1600
- ele.insertAdjacentHTML("beforeend", text);
1649
+ ele.insertAdjacentHTML("beforeend", DOMUtilsCommonUtils.getSafeHTML(text));
1601
1650
  }
1602
1651
  else {
1603
1652
  ele.appendChild(text);
@@ -1643,7 +1692,7 @@
1643
1692
  return;
1644
1693
  }
1645
1694
  if (typeof content === "string") {
1646
- element.insertAdjacentHTML("afterbegin", content);
1695
+ element.insertAdjacentHTML("afterbegin", DOMUtilsCommonUtils.getSafeHTML(content));
1647
1696
  }
1648
1697
  else {
1649
1698
  let $firstChild = element.firstChild;
@@ -1680,7 +1729,7 @@
1680
1729
  return;
1681
1730
  }
1682
1731
  if (typeof content === "string") {
1683
- element.insertAdjacentHTML("afterend", content);
1732
+ element.insertAdjacentHTML("afterend", DOMUtilsCommonUtils.getSafeHTML(content));
1684
1733
  }
1685
1734
  else {
1686
1735
  let $parent = element.parentElement;
@@ -1719,7 +1768,7 @@
1719
1768
  return;
1720
1769
  }
1721
1770
  if (typeof content === "string") {
1722
- element.insertAdjacentHTML("beforebegin", content);
1771
+ element.insertAdjacentHTML("beforebegin", DOMUtilsCommonUtils.getSafeHTML(content));
1723
1772
  }
1724
1773
  else {
1725
1774
  let $parent = element.parentElement;
@@ -1779,7 +1828,7 @@
1779
1828
  });
1780
1829
  return;
1781
1830
  }
1782
- element.innerHTML = "";
1831
+ DOMUtilsContext.html(element, "");
1783
1832
  }
1784
1833
  /**
1785
1834
  * 获取元素相对于文档的偏移坐标(加上文档的滚动条)
@@ -1989,10 +2038,10 @@
1989
2038
  if (typeof duration !== "number" || duration <= 0) {
1990
2039
  throw new TypeError("duration must be a positive number");
1991
2040
  }
1992
- if (typeof callback !== "function" && callback !== void 0) {
2041
+ if (typeof callback !== "function" && callback !== undefined) {
1993
2042
  throw new TypeError("callback must be a function or null");
1994
2043
  }
1995
- if (typeof styles !== "object" || styles === void 0) {
2044
+ if (typeof styles !== "object" || styles === undefined) {
1996
2045
  throw new TypeError("styles must be an object");
1997
2046
  }
1998
2047
  if (Object.keys(styles).length === 0) {
@@ -2051,7 +2100,7 @@
2051
2100
  element = element;
2052
2101
  // 创建一个新的div元素,并将wrapperHTML作为其innerHTML
2053
2102
  let wrapper = DOMUtilsContext.windowApi.document.createElement("div");
2054
- wrapper.innerHTML = wrapperHTML;
2103
+ DOMUtilsContext.html(wrapper, wrapperHTML);
2055
2104
  let wrapperFirstChild = wrapper.firstChild;
2056
2105
  // 将要包裹的元素插入目标元素前面
2057
2106
  let parentElement = element.parentElement;
@@ -2147,7 +2196,7 @@
2147
2196
  }
2148
2197
  function parseHTMLByCreateDom() {
2149
2198
  let tempDIV = DOMUtilsContext.windowApi.document.createElement("div");
2150
- tempDIV.innerHTML = html;
2199
+ DOMUtilsContext.html(tempDIV, html);
2151
2200
  if (isComplete) {
2152
2201
  return tempDIV;
2153
2202
  }