首頁猿問如何使用...

如何使用 document.body.appendChild 將對象添加到腳本標(biāo)簽

JavaScript

富國滬深 2022-07-08 09:54:48

我有一個(gè)用 asp.net MVC 編寫的網(wǎng)站，我正在嘗試用 React 復(fù)制它在某些頁面中，我有這個(gè)腳本標(biāo)簽：@section Scripts{ <script src="https://some.url.that.returns.an.object.com"> { loginURL: 'http//:blahBlah/login', logoutURL: 'http://blahBlah/Logout' } </script>}到目前為止，我設(shè)法在該特定頁面上創(chuàng)建腳本標(biāo)簽，但我不知道如何添加該 loginUrl 和 logoutUrl用這個(gè)代碼做到了：useEffect(() => { const script = document.createElement('script') script.src = `https://some.url.that.returns.an.object.com` script.async = true script.onload = () => scriptLoaded() document.body.appendChild(script) })我怎樣才能添加這些網(wǎng)址？我的應(yīng)用程序是用 ReactJS 編寫的，在 React 中有什么方法可以讓我做得更好嗎？

查看完整描述

1 回答

DIEA

TA貢獻(xiàn)1820條經(jīng)驗(yàn) 獲得超2個(gè)贊

要設(shè)置標(biāo)簽的文本內(nèi)容script，請使用textContent（或innerText用于過時(shí)的瀏覽器）：

const script = document.createElement('script')

script.src = `https://some.url.that.returns.an.object.com`

script.textContent = `{

loginURL: 'http//:blahBlah/login',

logoutURL: 'http://blahBlah/Logout'

}`;

script.async = true

script.onload = () => scriptLoaded()

但：

當(dāng)標(biāo)簽中有文本script并且標(biāo)簽有script時(shí)src，其中的文本只是“文檔”。有可能被引用的腳本src可以確定它從哪個(gè)script標(biāo)簽加載并可以使用該內(nèi)容，但是如果您動(dòng)態(tài)創(chuàng)建腳本，它的執(zhí)行方式可能不起作用。
這不太可能是您希望在 React 項(xiàng)目中執(zhí)行此操作的方式。在 React 中，您幾乎從不想直接操作 DOM。它有時(shí)會(huì)出現(xiàn)，但總的來說，你會(huì)盡量避免它。