Issues with Theme Components [JavaScript]

Dev
1

I have a problem with JavaScript. When I upload it, it doesn’t work. If I write everything into an HTML file and open it locally, it works fine. But when I put it into a theme component, it doesn’t work.
image

The button doesn’t work when clicked.

image
image605×535 38.6 KB

It works fine when opened locally using HTML.
The close button in the top right corner behaves the same way.

Combine CSS and JavaScript in HTML 
<html>
	<head>
		<meta charset="utf-8">
		<style>
			/*右侧悬浮box和赞赏码*/
/* 悬浮盒子 */
.guigui_xfkp {
	position: fixed;
	right: 120px;
	bottom: 50px;
	box-sizing: border-box;
	padding: 18px 10px 22px 20px;
	width: 400px;
	height: 175px;
	border-radius: 20px;
	background-color: #ffffff;
	background-position: right 50%;
	background-repeat: no-repeat;
	background-size: 130px;
	box-shadow: 0px 0px 8px rgba(236, 59, 136, 0.35);
	/*background-image: url(https://cache.cenguigui.cn/images/loginee.png);*/
	transition: right 1s linear 0s;
	z-index: 3;
	animation: jinru 2s;
	-webkit-animation: jinru 2s;
	--guigui_right: -500px;
	--guigui_right_go: 120px;
}

@keyframes jinru {
	0% {
		right: var(--guigui_right);
	}

	100% {
		right: var(--guigui_right_go);
	}
}

.guigui_biaoti {
	margin-bottom: 10px;
	color: rgb(0, 0, 0);
	font-weight: bold;
	font-size: 20px;
}

#guigui_jzsc {
	color: #000000;
}

.guigui_text {
	margin: 15px 0;
	color: rgb(255, 127, 227);
}

.guigui_zanzhu {
	width: 100px;
	height: 35px;
	text-align: center;
	line-height: 35px;
	border-radius: 10px;
	background-color: #ffb5c3;
}

.guigui_zanzhu p {
	color: #ffffff;
	font-weight: bold;
	display: block;
	width: 100px;
	height: 35px;
	cursor: pointer;
}

.guigui_zanzhu p:hover {
	transition: 0.8s all;
	color: rgb(247, 54, 86);
}

.guigui_xfkpgb {
	width: 30px;
	height: 30px;
	position: absolute;
	top: 10px;
	right: 10px;
	cursor: pointer;
}

.guigui_xfkpgb svg {
	width: 30px;
	height: 30px;
	transform: rotate(0deg);
	transition: transform 0.5s linear 0s;
}

.guigui_xfkpgb svg:hover {
	transform: rotate(-720deg);
}

/* 赞助box */
/* 二维码 */
.guigui_skm_box {
	/* display: none; */
	position: fixed;
	z-index: 3;
	right: 150px;
	bottom: 300px;
	width: 475px;
	height: 175px;
	padding-top: 38px;
	/* 收款码box方框 */
	background: url(https://cache.cenguigui.cn/images/ds/bg-cat-main.png) no-repeat top;
	background-size: 100% auto;
	transition: right 2s linear 0s;
	animation: guigui_skmdh 2s;
	/* --guigui_skm:-500px;
	--guigui_skm_to:150px; */
}

@keyframes guigui_skmdh {
	0% {
		right: var(--guigui_skm);
		opacity: 0;
	}

	100% {
		right: var(--guigui_skm_to);
		opacity: 1;
	}
}

.guigui_skm {
	width: 475px;
	height: 190px;
	display: flex;
	padding: 10px;
	border: 1px solid #FFB5C3;
	border-radius: 8px;
	background-color: #ffffff;
	box-shadow: inset 0 5px 25px 0 #FFD1D8;
}

.guigui_skm_img_p {
	width: 400px;
	height: 175px;
	cursor: default;
}

.guigui_skm_img_p img {
	width: 150px;
	height: 150px;
}

.guigui_skm_img_p p {
	text-align: center;
	font-weight: bold;
				/* padding-top: 10px; */
	color: #000000;
}

.guigui_skm svg {
	position: absolute;
	top: 20px;
	right: -20px;
	width: 30px;
	height: 30px;
	cursor: pointer;
	transition: transform 0.5s linear 0s;
}

.guigui_skm svg:hover {
	transform: rotate(-720deg);
}
	/* 手机端隐藏美化赞赏码 */
@media screen and (max-width:990px) {
	/* 隐藏悬浮的box */
	.guigui_xfkp {
		display: none;
	}
	/* 美化赞赏码box */
	.guigui_skm_box {
		display: none;
	}
}

/* 手机端打赏码 */
.guigui_reward {
	font-size: 16px;
	text-align: center;
	display:
		none;
}

#rewardButton {
	/* border: 1px solid#f77b83; */
	background-color:
		#00000000;
	line-height: 36px;
	text-align: center;
	cursor: pointer;
	height:
		36px;
	display: block;
	border-radius: 4px;
	transition-duration: .4s;
	color:
		#fff;
	margin: 0 auto;
	padding: 0 25px;
	outline-style: none;
}

#QR {
	padding-top:
		20px;
}

#QR img {
	width: 180px;
	max-width: 100%;
	display: inline-block;
	margin: .8em 2em 0;
	border: 1px solid #ddd;
	padding: 3px;
	background: #f8f8f8;
}

/* 手机端隐藏美化赞赏码 */
@media screen and (max-width:980px) {

	/* 显示简易版的打赏 */
	.guigui_reward {
		display: block;
	}
}
</style>

		<script>
			// 右侧悬浮box和赞赏码
			// 赞助js
			// 打开赞赏码
			//1
			function guigui_skmkq() {
			    const xfxkp = document.getElementById('guigui_skmqk');
			    if (xfxkp) {
			        // 设置动画的开始和结束位置为正向
			        xfxkp.style.setProperty('--guigui_right', '-500px');
			        xfxkp.style.setProperty('--guigui_right_go', '120px');
			
			        // 确保元素是可见的
			        xfxkp.style.display = 'block';
			
			        // 重新触发动画
			        xfxkp.style.animation = 'none'; // 首先移除动画以重置
			        xfxkp.offsetHeight; // 触发重绘
			        xfxkp.style.animation = 'jinru 3s forwards'; // 应用新的动画
			    }
			}
			// 关闭赞赏码
			function guigui_guanbi_skm() {
			    const xfxkp = document.getElementById('guigui_skmqk');
			    if (xfxkp) {
			        // 设置动画的开始和结束位置为反向
			        xfxkp.style.setProperty('--guigui_skm', '150px');
			        xfxkp.style.setProperty('--guigui_skm_to', '-500px');
			        // 重新触发动画
			        xfxkp.style.animation = 'none'; // 首先移除动画以重置
			        xfxkp.offsetHeight; // 触发重绘
			        xfxkp.style.animation = 'guigui_skmdh 2s forwards'; // 应用新的动画
			        xfxkp.addEventListener('animationend',
			            function () {
			                xfxkp.style.display = 'none'; // 动画完成后隐藏元素
			            },
			            {
			                once: true //我不知道
			            });
			    }
			}
			
			// 关闭右下方悬浮盒子
			function guanbi() {
			    const xfxkp = document.getElementById('guigui_xfxkp');
			    if (xfxkp) {
			        // 设置动画的开始和结束位置为反向
			        xfxkp.style.setProperty('--guigui_right', '120px');
			        xfxkp.style.setProperty('--guigui_right_go', '-500px');
			        // 重新触发动画
			        xfxkp.style.animation = 'none'; // 首先移除动画以重置
			        xfxkp.offsetHeight; // 触发重绘
			        xfxkp.style.animation = 'jinru 3s forwards'; // 应用新的动画
			        xfxkp.addEventListener('animationend',
			            function () {
			                xfxkp.style.display = 'none'; // 动画完成后隐藏元素
			            },
			            {
			                once: true
			            });
			    }
			}
		</script>

		<script>
			window._iconfont_svg_string_4458810='<svg><symbol id="icon-guanbi" viewBox="0 0 1024 1024"><path d="M512 45.373397c-257.710456 0-466.626603 208.916147-466.626603 466.626603s208.915124 466.626603 466.626603 466.626603 466.626603-208.915124 466.626603-466.626603S769.710456 45.373397 512 45.373397zM754.945171 664.329361c22.561855 22.561855 22.561855 59.482743 0 82.044598l-20.511149 20.511149c-22.561855 22.561855-59.482743 22.561855-82.044598 0L506.030032 620.524692 359.670639 766.884085c-22.561855 22.561855-59.482743 22.561855-82.044598 0l-20.511149-20.511149c-22.561855-22.561855-22.561855-59.482743 0-82.044598l146.359392-146.359392L245.175979 359.670639c-22.561855-22.561855-22.561855-59.482743 0-82.044598l20.511149-20.511149c22.561855-22.561855 59.482743-22.561855 82.044598 0L506.030032 415.414221l158.298306-158.298306c22.561855-22.561855 59.482743-22.561855 82.044598 0l20.511149 20.511149c22.561855 22.561855 22.561855 59.482743 0 82.044598L608.585779 517.968945 754.945171 664.329361z" fill="#ffb5c3" ></path></symbol></svg>',function(n){var t=(t=document.getElementsByTagName("script"))[t.length-1],e=t.getAttribute("data-injectcss"),t=t.getAttribute("data-disable-injectsvg");if(!t){var i,o,c,d,s,l=function(t,e){e.parentNode.insertBefore(t,e)};if(e&&!n.__iconfont__svg__cssinject__){n.__iconfont__svg__cssinject__=!0;try{document.write("<style>.svgfont {display: inline-block;width: 1em;height: 1em;fill: currentColor;vertical-align: -0.1em;font-size:16px;}</style>")}catch(t){console&&console.log(t)}}i=function(){var t,e=document.createElement("div");e.innerHTML=n._iconfont_svg_string_4458810,(e=e.getElementsByTagName("svg")[0])&&(e.setAttribute("aria-hidden","true"),e.style.position="absolute",e.style.width=0,e.style.height=0,e.style.overflow="hidden",e=e,(t=document.body).firstChild?l(e,t.firstChild):t.appendChild(e))},document.addEventListener?~["complete","loaded","interactive"].indexOf(document.readyState)?setTimeout(i,0):(o=function(){document.removeEventListener("DOMContentLoaded",o,!1),i()},document.addEventListener("DOMContentLoaded",o,!1)):document.attachEvent&&(c=i,d=n.document,s=!1,r(),d.onreadystatechange=function(){"complete"==d.readyState&&(d.onreadystatechange=null,a())})}function a(){s||(s=!0,c())}function r(){try{d.documentElement.doScroll("left")}catch(t){return void setTimeout(r,50)}a()}}(window);
		</script>
		<script>
			/**
			  * TypeIt - The most versatile animated typing utility on the planet.
			  * Author: Alex MacArthur <alex@macarthur.me> (https://macarthur.me)
			  * Version: v7.0.4
			  * License: GPL-2.0
			  * URL: https://typeitjs.com
			  */
			!function(n,t){"object"==typeof exports&&"undefined"!=typeof module?module.exports=t():"function"==typeof define&&define.amd?define(t):(n=n||self).TypeIt=t()}(this,(function(){"use strict";function n(t){return(n="function"==typeof Symbol&&"symbol"==typeof Symbol.iterator?function(n){return typeof n}:function(n){return n&&"function"==typeof Symbol&&n.constructor===Symbol&&n!==Symbol.prototype?"symbol":typeof n})(t)}var t={strings:[],speed:100,cursor:!0,cursorChar:"|",cursorSpeed:1e3,deleteSpeed:null,lifeLike:!0,breakLines:!0,startDelay:250,startDelete:!1,nextStringDelay:750,loop:!1,loopDelay:750,html:!0,waitUntilVisible:!1,beforeString:function(){},afterString:function(){},beforeStep:function(){},afterStep:function(){},afterComplete:function(){}},e=function(n){return n.map((function(n){return void 0===n[1]&&n.push(null),void 0===n[2]&&n.push({}),n}))},r=function(n,t){return Object.assign({},n,t)},i=function(n){return Array.isArray(n)},o=function(n,t){return n[2]=r(n[2],t)||t,n},u=function(n,t){return i(n[0])?n.map((function(n){return o(n,t)})):o(n,t)},c=function(n,t,e,r){r=r||!1,e=e||{};var o=!i(n),c=n.length;return(n=o?new Array(n).fill(0):n).map((function(n,i){if(o)return t;var a=[t,n,e];return r&&(0===i&&(a=u(a,{isFirst:!0})),i+1===c&&(a=u(a,{isLast:!0}))),a}))};function a(n){this.insert=function(n,e){t.splice(n,0,e)},this.add=function(n,u,a){return n=i(n)?n:[n,null],a=a||!1,u=u||1,i(n[0])||(n=c(u,n)),n=e(n).map((function(n){return n[2]=r(n[2],{id:o}),o++,n})),t=a?n.concat(t):t.concat(n),this},this.set=function(n,e){t[n]=e},this.reset=function(){t=t.map((function(n){return n[2].executed=!1,n}))},this.getItems=function(){return(t=e(t)).filter((function(n){return!n[2].executed}))},this.setMeta=function(n,e){var i=t.findIndex((function(t){return t[2].id===n}));t[i][2]=r(t[i][2],e)};var t=[],o=0;this.add(n)}var f=function(n){return Array.from(n)},s=function(n){var t=[];return t.concat.apply(t,n)},l=function(n){var t=document.implementation.createHTMLDocument("");return t.body.innerHTML=n,t.body},d=function n(t,e,r){e=e||null,r=void 0!==r&&r;var i=f(t.childNodes).map((function(t){return 3===(e=t).nodeType||"BR"===e.tagName?t:n(t);var e}));return i=s(i),e&&(i=i.filter((function(n){return!e.contains(n)}))),r?i.reverse():i},p=function(n){return"BODY"===n.tagName},h=function(n,t){t=t||null;var e=n instanceof HTMLElement;return{node:t,isTopLevelText:(!t||p(t.parentNode))&&!e,isHTMLElement:e,content:n}};function v(n){var t,e=l(n);return t=d(e).map((function(n){return n.nodeValue?f(n.nodeValue).map((function(t){return h(t,n)})):h(n)})),s(t)}function y(n,t){return(t=void 0===t||t)?v(n):f(n).map((function(n){return h(n)}))}var m=function(n){return document.createElement(n)},g=function(n,t){var e=m("style");e.id=t||"",e.appendChild(document.createTextNode(n)),document.head.appendChild(e)},b=function(n){return i(n)||(n=[n/2,n/2]),{before:n[0],after:n[1],total:n[0]+n[1]}},S=function(n,t){return Math.abs(Math.random()*(n+t-(n-t))+(n-t))};var N=function(n){return["textarea","input"].indexOf(n.tagName.toLowerCase())>-1},T=function(n,t){var e=t.querySelectorAll("*");return[t].concat(f(e).reverse()).find((function(t){return t.cloneNode().outerHTML===n.outerHTML}))},L=function(n,t,e,r){e=e||null;var i=t.isHTMLElement,o=i?t.content:document.createTextNode(t.content);if(N(n))n.value="".concat(n.value).concat(t.content);else{if(!t.isTopLevelText&&!i){var u=t.node.parentNode,c=T(u.cloneNode(),n);if(function(n,t){if(!n)return!1;var e=n.nextSibling;return!e||e.isEqualNode(t)}(c,e))n=c;else if((o=u.cloneNode()).innerText=t.content,!p(u.parentNode)){for(var a=u.parentNode,f=a.cloneNode(),s=T(f,n);!s&&!p(a);)f.innerHTML=o.outerHTML,o=f,f=a.parentNode.cloneNode(),a=a.parentNode,s=T(f,n);n=s||n}}var l=d(n,e,!0)[r-1],h=l?l.parentNode:n;h.insertBefore(o,h.contains(e)?e:null)}},M=function(n){var t;return null==n||null===(t=n.parentNode)||void 0===t?void 0:t.removeChild(n)};var x=function(n,t,e){var r,i="string"==typeof n,o=!1,u=-1*n;return i&&(u=(r="END"===n.toUpperCase())?-1:1,o=r?t+u>0:t+u<e.length),{isString:i,numberOfSteps:u,canKeepMoving:o}},w=function(n){var t,e=["font","lineHeight","color"],r=m("SPAN"),i=(t=n,window.getComputedStyle(t,null));for(var o in i)e.indexOf(o)>-1&&i[o]&&(r.style[o]=i[o]);return r.style.cssText};function D(n,t,e){return e?t?t(n):n:(n&&n.then||(n=Promise.resolve(n)),t?n.then(t):n)}function H(n){return function(){for(var t=[],e=0;e<arguments.length;e++)t[e]=arguments[e];try{return Promise.resolve(n.apply(this,t))}catch(n){return Promise.reject(n)}}}function E(){}function C(n,t){if(!t)return n&&n.then?n.then(E):Promise.resolve()}function A(n,t){var e=n();return e&&e.then?e.then(t):t(e)}function k(n,t,e){if(!n.s){if(e instanceof O){if(!e.s)return void(e.o=k.bind(null,n,t));1&t&&(t=e.s),e=e.v}if(e&&e.then)return void e.then(k.bind(null,n,t),k.bind(null,n,2));n.s=t,n.v=e;var r=n.o;r&&r(n)}}var O=function(){function n(){}return n.prototype.then=function(t,e){var r=new n,i=this.s;if(i){var o=1&i?t:e;if(o){try{k(r,1,o(this.v))}catch(n){k(r,2,n)}return r}return this}return this.o=function(n){try{var i=n.v;1&n.s?k(r,1,t?t(i):i):e?k(r,1,e(i)):k(r,2,i)}catch(n){k(r,2,n)}},r},n}();function P(n,t){return n&&n.then?n.then(t):t(n)}return function(e,o){var u=this,s=this;o=o||{};var p=function(n,t,e){return n=i(n[0])?n:[n],an.add(n,t),function(n){var t=(n=n||{}).delay;t&&an.add([U,t])}(e),s},T=function(t){return t="object"===n(t)?t:{},[[Q,t,{force:!0}],[Q,en,{force:!0}]]},z=function(){return X?f(W.value):d(W,fn,!0)},B=function(n,t){t=t||1;var e=en.nextStringDelay;an.insert(n,[U,e.before]),an.insert(n+t+1,[U,e.after])},I=H((function(){if(fn){var n="[data-typeit-id='".concat(cn,"'] .ti-cursor");g("@keyframes blink-".concat(cn," { 0% {opacity: 0} 49% {opacity: 0} 50% {opacity: 1} } ").concat(n," { animation: blink-").concat(cn," ").concat(en.cursorSpeed/1e3,"s infinite; } ").concat(n,".with-delay { animation-delay: 500ms; } ").concat(n,".disabled { animation: none; }"),cn),W.appendChild(fn);var t="loaded"===document.fonts.status;return D(t||document.fonts.ready,(function(n){var t=fn.getBoundingClientRect().width/2;fn.style.margin="0 -".concat(t+2,"px 0 -").concat(t-2,"px")}),t)}})),R=function(n){fn&&(fn.classList.toggle("disabled",n),fn.classList.toggle("with-delay",!n))},q=H((function(n,t){return $.push(setTimeout(n,t)),D()})),j=H((function(n){var t=_;return D(t&&F(_),(function(t){return an.reset(),an.set(0,[U,n.before]),C(G(!0))}),!t)})),V=H((function(){tn.started=!0;var n,t=an.getItems();return P(function(n,t){try{var e=n()}catch(n){return t(n)}return e&&e.then?e.then(void 0,t):e}((function(){return P(function(n,t,e){var r,i,o=-1;return function u(c){try{for(;++o<n.length&&(!e||!e());)if((c=t(o))&&c.then){if(!((a=c)instanceof O&&1&a.s))return void c.then(u,i||(i=k.bind(null,r=new O,2)));c=c.v}r?k(r,1,c):r=c}catch(n){k(r||(r=new O),2,n)}var a}(),r}(t,(function(e){if(tn.frozen||tn.destroyed)throw"";var r,i,o,c,a=t[e],f=a[2];return n=[a,u],f.freezeCursor&&R(!0),r=en.speed,i=en.deleteSpeed,o=en.lifeLike,c=(i=null!==i?i:r/3)/2,Z=o?[S(r,r/2),S(i,c)]:[r,i],A((function(){var t;if(null==f?void 0:f.isFirst)return C((t=en).beforeString.apply(t,n))}),(function(){var t;return D((t=en).beforeStep.apply(t,n),(function(){return D(a[0].call(u,a[1],f),(function(){return A((function(){var t,e;if(null===(t=a[2])||void 0===t?void 0:t.isLast)return C((e=en).afterString.apply(e,n))}),(function(){var t;return D((t=en).afterStep.apply(t,n),(function(){an.setMeta(f.id,{executed:!0}),R(!1)}))}))}))}))}))}),(function(){return!1})),(function(t){var e;return tn.completed=!0,D((e=en).afterComplete.apply(e,n),(function(){if(!en.loop)throw"";var n=en.loopDelay;q((function(){return D(j(n),(function(){V()}))}),n.after)}))}))}),E),(function(n){return u}))})),U=function(n){return new Promise((function(t){q((function(){return t()}),n||0)}))},F=function n(t){var e=z(),r=x(t,_,e);return _+=r.numberOfSteps,new Promise((function(t){q(H((function(){return function(n,t,e,r){if(e){var i=r,o=t[(i=i>t.length?t.length:i)-1];(n=o?o.parentNode:n).insertBefore(e,o||null)}}(W,z(),fn,_),A((function(){if(r.isString&&r.canKeepMoving)return C(n(r.numberOfSteps>0?"START":"END"))}),(function(){return t()}))})),Z[0])}))},K=function(n){return new Promise((function(t){q((function(){return L(W,n,fn,_),t()}),Z[0])}))},Q=H((function(n){en=r(en,n)})),Y=H((function(){X?W.value="":z().forEach((function(n){M(n)}))})),G=function n(t){return t=!0===t,new Promise((function(e){q(H((function(){var r=!1,i=z();return i.length&&(X?W.value=W.value.slice(0,-1):M(i[_])),f(W.querySelectorAll("*")).forEach((function(n){if(!n.innerHTML&&"BR"!==n.tagName){for(var t=n;1===t.parentNode.childNodes.length&&t.parentNode.childNodes[0].isEqualNode(t);)t=t.parentNode;M(t)}})),A((function(){if(t&&i.length-1>0)return D(n(!0),(function(){return r=!0,e()}))}),(function(n){return r?n:e()}))})),Z[1])}))};this.break=function(n){return p([K,h(m("BR"))],1,n)},this.delete=function(n,t){var e=T(t);return p([e[0]].concat([].concat(Array(Math.abs(n)||1)).fill().map((function(){return[G,!n,nn]})),[e[1]]),1,t)},this.empty=function(){return p(Y,1,arguments)},this.exec=function(n,t){var e=T(t);return p([e[0],[n,null],e[1]],1,t)},this.move=function(n,t){var e=x(n,_,z()),r=T(t),i=e.isString?n:Math.sign(n);return p([r[0]].concat([].concat(Array(Math.abs(n)||1)).fill().map((function(){return[F,i,nn]})),[r[1]]),1,t)},this.options=function(n){return p([Q,n],1,n)},this.pause=function(n,t){return p([U,n],1,t)},this.type=function(n,t){var e=T(t),r=y(n,en.html),i=[e[0]].concat(c(r,K,nn,!0),[e[1]]);return p(i,1,t)},this.is=function(n){return tn[n]},this.destroy=function(n){n=void 0===n||n,$.forEach((function(n){clearTimeout(n)})),$=[],n&&M(fn),tn.destroyed=!0},this.freeze=function(){tn.frozen=!0},this.unfreeze=function(){tn.frozen=!1,V()},this.reset=function(){for(var n in!this.is("destroyed")&&this.destroy(),an.reset(),_=0,tn)tn[n]=!1;return X?W.value="":W.innerHTML="",this},this.go=function(){return tn.started?this:(I(),en.waitUntilVisible?(function(n,t){new IntersectionObserver((function(e,r){e.forEach((function(e){e.isIntersecting&&(t(),r.unobserve(n))}))}),{threshold:1}).observe(n)}(W,V.bind(this)),this):(V(),this))},this.getQueue=function(){return an},this.getOptions=function(){return en},this.getElement=function(){return W};var J,W="string"==typeof(J=e)?document.querySelector(J):J,X=N(W),Z=[],$=[],_=0,nn={freezeCursor:!0},tn={started:!1,completed:!1,frozen:!1,destroyed:!1},en=r(t,o);en=r(en,{html:!X&&en.html,nextStringDelay:b(en.nextStringDelay),loopDelay:b(en.loopDelay)});var rn,on,un,cn=Math.random().toString().substring(2,9),an=new a([U,en.startDelay]);W.setAttribute("data-typeit-id",cn),g("[data-typeit-id]:before {content: '.'; display: inline-block; width: 0; visibility: hidden;}[data-typeit-id]"),en.strings=(un=en.strings,rn=i(un)?un:[un],(on=function(n){return n.innerHTML.replace(/<\!--.*?-->/g,"").trim()}(W))?(W.innerHTML="",en.startDelete?(v(on).forEach((function(n){L(W,n,fn,_)})),an.add([G,!0]),B(1),rn):[on.trim()].concat(rn)):rn);var fn=function(){if(X||!en.cursor)return null;var n=m("span");return n.innerHTML=l(en.cursorChar).innerHTML,n.className="ti-cursor",n.style.cssText="display:inline;".concat(w(W)),n}();en.strings.length&&function(){var n=en.strings.filter((function(n){return!!n}));n.forEach((function(t,e){var r=y(t,en.html);an.add(c(r,K,nn,!0));var i=an.getItems().length;if(e+1!==n.length){if(en.breakLines){var o=h(m("BR"));return an.add([K,o,nn]),void B(i)}an.add(c(r,G,nn)),B(i,t.length)}}))}()}}));
		</script>
	</head>
	<body>
		<!-- 右下角卡片 -->
		<div class="guigui_xfkp" id="guigui_xfxkp" style="background-image: url(https://mms0.baidu.com/it/u=1094456095,3224255275&amp;fm=253&amp;app=138&amp;f=JPEG?w=500&amp;h=500);">
			<div class="guigui_biaoti" data-typeit-id="4846635">
				<span class="ti-cursor with-delay" style="display: inline; color: rgb(0, 0, 0); font: 700 20px GuiguiFontStyle; margin: 0px -4.67188px 0px -0.671875px;">|</span>
			</div>
			<div id="guigui_jzsc"></div>
			<div class="guigui_text" data-typeit-id="8524720">
				<span class="ti-cursor with-delay" style="display: inline; color: rgb(255, 127, 227); font: 14px GuiguiFontStyle;">|</span>
			</div>
			<div class="guigui_zanzhu" onclick="guigui_skmkq()">
				<p>
					赞助一下
				</p>
			</div>
			<div class="guigui_xfkpgb" onclick="guanbi()">
				<svg class="icon" aria-hidden="true">
					<use xlink:href="#icon-guanbi">
					</use>
				</svg>
			</div>
		</div>
		<!-- 右下角卡片 end-->
		<!-- 赞赏码 -->
		<div class="guigui_skm_box" id="guigui_skmqk" style="display: none;">
			<div class="guigui_skm">
				<div class="guigui_skm_img_p">
					<!-- QQ收款码 -->
					<img data-src="https://cache.cenguigui.cn/images/ds/qqskm.jpg" alt="" src="./笒鬼鬼api_files/qqskm.jpg">
					<p>
						QQ收款码
					</p>
				</div>
				<div class="guigui_skm_img_p">
					<!-- 微信收款码 -->
					<img data-src="https://cache.cenguigui.cn/images/ds/wxskm.jpg" alt="" src="./笒鬼鬼api_files/wxskm.jpg">
					<p>
						微信收款码
					</p>
				</div>
				<div class="guigui_skm_img_p">
					<!-- 支付宝收款码 -->
					<img data-src="https://cache.cenguigui.cn/images/ds/zfbskm.jpg" alt="" src="./笒鬼鬼api_files/zfbskm.jpg">
					<p>
						支付宝收款码
					</p>
				</div>
				<span onclick="guigui_guanbi_skm()">
					<svg class="guigui_icon" aria-hidden="true">
						<use xlink:href="#icon-guanbi">
						</use>
					</svg>
				</span>
			</div>
		</div>
		<!-- 手机端赞赏码 -->
		<div class="guigui_reward">
			<button id="rewardButton" disable="enable" onclick="var qr = document.getElementById(&#39;QR&#39;); if (qr.style.display === &#39;none&#39;) {qr.style.display=&#39;block&#39;;} else {qr.style.display=&#39;none&#39;}">
				<span>
					打赏
				</span>
			</button>
			<div id="QR" style="display: none;">
				<div id="wechat" style="display: inline-block">
					<a class="fancybox" rel="group">
						<img id="wechat_qr" src="./笒鬼鬼api_files/wxskm.jpg" alt="微信打赏">
					</a>
					<p>
						微信
					</p>
				</div>
				<div id="alipay" style="display: inline-block">
					<a class="fancybox" rel="group">
						<img id="alipay_qr" src="./笒鬼鬼api_files/zfbskm.jpg" alt="还是支付宝打赏">
					</a>
					<p>
						支付宝
					</p>
				</div>
			</div>
		</div>
		<!-- 加载打字js -->
		<script type="text/javascript">
			// 计算本站安全运行时长的函数
					    // 获取id为guigui_jzsc的div元素
					    var div = document.getElementById('guigui_jzsc');
					
					    function getRunningTime() {
					        var now = new Date();
					        var startDate = new Date('2022-08-15'); // 假设站点开始运行的日期
					        var diff = now - startDate; // 相差的毫秒数
					        // 计算完整年份
					        var years = now.getFullYear() - startDate.getFullYear();
					        // 检查是否需要调整年份（如果今年的当前日期还没到开始日期，则减去一年）
					        if (now.getMonth() < startDate.getMonth() || (now.getMonth() === startDate.getMonth() && now.getDate() < startDate.getDate())) {
					            years--;
					        }
					        // 调整startDate到当前年份的相同月日，以计算剩余的天数
					        startDate.setFullYear(now.getFullYear());
					        // 如果经过调整后的startDate大于当前日期，则需要将startDate再往前调整一年
					        if (startDate > now) {
					            startDate.setFullYear(now.getFullYear() - 1);
					        }
					        diff = now - startDate; // 重新计算相差的毫秒数
					        var days = Math.floor(diff / (1000 * 60 * 60 * 24)); // 计算天数
					        var hours = Math.floor((diff % (1000 * 60 * 60 * 24)) / (1000 * 60 * 60)); // 计算小时数
					        var minutes = Math.floor((diff % (1000 * 60 * 60)) / (1000 * 60)); // 计算分钟数
					        var seconds = Math.floor((diff % (1000 * 60)) / 1000); // 计算秒数
					        // 将结果赋值给div的innerText属性
					        div.innerText = "本站已安全运行" + years + "年" + days + "天" + hours + "时" + minutes + "分" + seconds + "秒";
					    }
					    // 每秒更新一次运行时长
					    setInterval(getRunningTime, 1000);
					    // 初始显示一次
					    getRunningTime();
					    // 打字机
					    // 打印标题
					    new TypeIt(".guigui_biaoti", {
					            speed: 100,
					            waitUntilVisible: true
					        }).type("笒鬼鬼api")
					        // .pause(500) // 在两段文本之间暂停500毫秒。
					        // .type("欢迎来到我的api接口站！")
					        .go();
					    // 打印欢迎
					    new TypeIt(".guigui_text", {
					        loop: true,
					        cursorSpeed: 1000,
					        speed: 100
					    }).type("你好陌生人").pause(2000).delete(null, {
					        delay: 500
					    }).type("欢迎来到笒鬼鬼api！").pause(3000).go();
		</script>
	</body>

</html>
Error on the website 
Ex.js:1333 version: 12
Ex.js:3847 before all_funcdisable
/?preview_theme_id=212:380 
        
        
        GET https://www.justnainai.com/%E7%AC%92%E9%AC%BC%E9%AC%BCapi_files/qqskm.jpg 404 (Not Found)
/?preview_theme_id=212:387 
        
        
        GET https://www.justnainai.com/%E7%AC%92%E9%AC%BC%E9%AC%BCapi_files/wxskm.jpg 404 (Not Found)
/?preview_theme_id=212:394 
        
        
        GET https://www.justnainai.com/%E7%AC%92%E9%AC%BC%E9%AC%BCapi_files/zfbskm.jpg 404 (Not Found)
Ex.js:3850 undefined
Ex.js:3858 all_funcdisable
FingerPrint.js:19 has get the FIngerPrintSwitch
FingerPrint.js:20 false
/?preview_theme_id=212:437 
        
        
        GET https://www.justnainai.com/%E7%AC%92%E9%AC%BC%E9%AC%BCapi_files/wxskm.jpg 404 (Not Found)
/?preview_theme_id=212:437 
        
        
        GET https://www.justnainai.com/%E7%AC%92%E9%AC%BC%E9%AC%BCapi_files/zfbskm.jpg 404 (Not Found)
i18n-3b40e842fd72b9bcc74ea83e094c823cd9ca535e4ecc5e78722e6f99d3656137.js:1  Uncaught ReferenceError: require is not defined
    at i18n-3b40e842fd72b9bcc74ea83e094c823cd9ca535e4ecc5e78722e6f99d3656137.js:1:1
(匿名) @ i18n-3b40e842fd72b9bcc74ea83e094c823cd9ca535e4ecc5e78722e6f99d3656137.js:1
tags?v=43de2bf2704ed56ba600b37987a93e19:1  Uncaught ReferenceError: I18n is not defined
    at tags?v=43de2bf2704ed56ba600b37987a93e19:1:1
(匿名) @ tags?v=43de2bf2704ed56ba600b37987a93e19:1
deprecated.js:54  Deprecation notice: Using 'on' from 'discourse-common/utils/decorators' as a class property decorator is deprecated. You should import it from '@ember-decorators/object' instead. [deprecation id: discourse.utils-decorators-on]
deprecated @ deprecated.js:54
(匿名) @ decorators.js:85
(匿名) @ applyDecoratedDescriptor.js:12
_applyDecoratedDescriptor @ applyDecoratedDescriptor.js:11
18034 @ user-posts-stream.js:63
__webpack_require__ @ bootstrap:19
56215 @ user-stream.js:138
__webpack_require__ @ bootstrap:19
61372 @ badge.js:74
__webpack_require__ @ bootstrap:19
36633 @ topic-tracking-state.js:1149
__webpack_require__ @ bootstrap:19
46828 @ category-list.js:116
__webpack_require__ @ bootstrap:19
52623 @ session.js:12
__webpack_require__ @ bootstrap:19
78553 @ ajax-error.js:102
__webpack_require__ @ bootstrap:19
83765 @ group-history.js:10
__webpack_require__ @ bootstrap:19
32274 @ create-invite-bulk.js:3
__webpack_require__ @ bootstrap:19
34190 @ second-factor-edit.js:7
__webpack_require__ @ bootstrap:19
6475 @ post-user-tip-shim.js:8
__webpack_require__ @ bootstrap:19
(匿名) @ discourse.js:497
s.exports @ loader.js:106
requireModule @ loader.js:27
58048 @ post:2
__webpack_require__ @ bootstrap:19
16273 @ watched-words.js:11
__webpack_require__ @ bootstrap:19
43347 @ users.js:122
__webpack_require__ @ bootstrap:19
48948 @ topic.js:12
__webpack_require__ @ bootstrap:19
(匿名) @ discourse.js:28
s.exports @ loader.js:106
requireModule @ loader.js:27
(匿名) @ start-app.js:4
(匿名) @ discourse-boot.js:13
(匿名) @ discourse-boot.js:1
app.js:239 ℹ️ Discourse v3.3.0.beta3-dev — https://github.com/discourse/discourse/commits/625c715856 — Ember v5.5.0
runtime.js:3551 [Intervention]Images loaded lazily and replaced with placeholders. Load events are deferred. See https://go.microsoft.com/fwlink/?linkid=2048113
deprecated.js:54  [PLUGIN discourse-multilingual-7b09ee8f71769eae6d165b6e9ce8db2649342ec4557f214a04e0add4c7be6211] Deprecation notice: Importing getOwner from `discourse-common/lib/get-owner` is deprecated. See the alternatives on meta. [deprecated since Discourse 3.2] [deprecation id: discourse.get-owner-with-fallback] [info: https://meta.discourse.org/t/292080]
deprecated @ deprecated.js:54
getOwner @ get-owner.js:23
r @ multilingual-route.js:19
c @ multilingual-route.js:33
d @ multilingual-route.js:38
e.removeParam @ multilingual-route.js:81
(匿名) @ multilingual-initializer.js:30
(匿名) @ plugin-api.js:126
(匿名) @ plugin-api.js:674
m @ index.js:200
trigger @ evented.js:27
(匿名) @ page-tracker.js:41
invoke @ backburner.js.js:282
flush @ backburner.js.js:197
flush @ backburner.js.js:358
_end @ backburner.js.js:798
end @ backburner.js.js:589
_runExpiredTimers @ backburner.js.js:905
setTimeout(异步)
setTimeout @ backburner.js.js:47
_installTimerTimeout @ backburner.js.js:948
_reinstallTimerTimeout @ backburner.js.js:932
_later @ backburner.js.js:865
throttle @ backburner.js.js:696
e.throttle @ index.js:273
_checkSize @ chat-drawer.js:142
_join @ backburner.js.js:824
join @ backburner.js.js:629
l @ index.js:81
(匿名) @ index.js:118
didInsertElement @ chat-drawer.js:61
r @ index.js:361
_trigger @ core_view.js:55
r @ index.js:361
_trigger @ ember-events.js:143
r @ index.js:361
didCreate @ index.js:2102
commit @ runtime.js:3965
commit @ runtime.js:4062
Nt @ runtime.js:4082
_renderRoots @ index.js:4916
_renderRootsTransaction @ index.js:4960
_renderRoot @ index.js:4905
_appendDefinition @ index.js:4830
appendOutletView @ index.js:4820
invoke @ backburner.js.js:282
flush @ backburner.js.js:197
flush @ backburner.js.js:358
_end @ backburner.js.js:798
B._boundAutorunEnd @ backburner.js.js:523
Promise.then(异步)
n @ backburner.js.js:26
flush @ index.js:40
_scheduleAutorun @ backburner.js.js:964
_end @ backburner.js.js:804
B._boundAutorunEnd @ backburner.js.js:523
Promise.then(异步)
n @ backburner.js.js:26
flush @ index.js:40
_scheduleAutorun @ backburner.js.js:964
_end @ backburner.js.js:804
B._boundAutorunEnd @ backburner.js.js:523
Promise.then(异步)
n @ backburner.js.js:26
flush @ index.js:40
_scheduleAutorun @ backburner.js.js:964
_end @ backburner.js.js:804
B._boundAutorunEnd @ backburner.js.js:523
Promise.then(异步)
n @ backburner.js.js:26
flush @ index.js:40
_scheduleAutorun @ backburner.js.js:964
_end @ backburner.js.js:804
B._boundAutorunEnd @ backburner.js.js:523
Promise.then(异步)
n @ backburner.js.js:26
flush @ index.js:40
_scheduleAutorun @ backburner.js.js:964
_end @ backburner.js.js:804
B._boundAutorunEnd @ backburner.js.js:523
Promise.then(异步)
n @ backburner.js.js:26
flush @ index.js:40
_scheduleAutorun @ backburner.js.js:964
_end @ backburner.js.js:804
B._boundAutorunEnd @ backburner.js.js:523
Promise.then(异步)
n @ backburner.js.js:26
flush @ index.js:40
_scheduleAutorun @ backburner.js.js:964
_end @ backburner.js.js:804
B._boundAutorunEnd @ backburner.js.js:523
Promise.then(异步)
n @ backburner.js.js:26
flush @ index.js:40
_scheduleAutorun @ backburner.js.js:964
_ensureInstance @ backburner.js.js:955
schedule @ backburner.js.js:648
e.schedule @ index.js:167
waitForDOMReady @ index.js:343
init @ index.js:251
b @ core.js:77
create @ core.js:401
(匿名) @ start-app.js:4
(匿名) @ discourse-boot.js:13
(匿名) @ discourse-boot.js:1
2 Likes