我正在嘗試創建一個 Document 物件，URL并將其設定為特定的自定義值。
我已經探索了下面提到的一些選項，但到目前為止還沒有做到。
我嘗試過的一個示例方法，解釋了哪里出錯以及我想要什么：
//run context is the browser on page http://localhost
// example URL value https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Operators/this
const loadDocument = async (url: URL) => {
// Fetching HTML from URL and parsing it into a document
const docText = (await fetch(url)).text()
const doc = new DOMParser().parseFromString(await fetchText(url.href), 'text/html')
// the following will now be http://localhost, but I need it to be the URL the page is downloaded from
// i.e https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Operators/this
console.log(doc.URL)
// the consequence of it being wrong is that any links to external resources using relative paths
// would be wrong as-well
console.log(doc.querySelector('link[rel="stylesheet"]').href)
// will be "http://localhost/static/css/main.1baf2b3e.chunk.css"
// instead of "https://developer.mozilla.org/static/css/main.1baf2b3e.chunk.css"
}
我在這里嘗試完成的主要事情是使用相對鏈接在資源上擁有正確的 URL。我可以嘗試通過遍歷 DOM 并更改使用原始 URL 的相對鏈接的任何內容的 URL 來手動解決此問題，但這似乎容易出錯。因此 - 希望通過在檔案上設定正確的基本 URL 來解決根目錄中的問題
我嘗試做的另一件事是document.implementation.createHTMLDocument()生成帶有about:blankURL 的檔案，并且無法明確設定它 =\
嘗試對 URL 屬性進行分配似乎也沒有做任何事情（并且在檔案中明確標記為只讀）
uj5u.com熱心網友回復：
當您查詢這些 href 屬性時，您實際上將它們的值作為相對路徑，這些相對路徑會根據它們運行的??背景關系被評估為不同的絕對 url。由于遍歷整個 dom 并對其進行更改會很瘋狂，我可能會建議有機會注入一個基本 html 元素，該元素將暗示任何相對 url 將映射到的基本路徑。它可以快速解決您的具體問題。
https://developer.mozilla.org/en-US/docs/Web/HTML/Element/base
<base> HTML 元素指定用于檔案中所有相對 URL 的基本 URL。一個檔案中只能有一個 <base> 元素。
當然，條件必須是所有這些相對 url 都映射到相同的 baseurl，但如果您從作業登錄頁面 url 獲取頁面，這是理所當然的。請注意，CORS 策略存在一些約束，尤其是當這些頁面上的 js 需要對該域執行 ajax 查詢時。我的意思是，這樣的解決方案不會給你任何可能場景的鑰匙。
<base href="https://thereal.com/absolute/url">
另一個來自MDNbaseURI的關于該屬性的有趣讀物：
Node 介面的只讀 baseURI 屬性回傳包含該節點的檔案的絕對基本 URL。
當瀏覽器需要獲取絕對 URL 時，基本 URL 用于決議相對 URL，例如在處理 HTML 元素的 src 屬性或 SVG 中的 xlink:href 或 href 屬性時。
雖然此屬性是只讀的，但其值是由每次訪問該屬性時的演算法確定的，并且可能會隨著條件的改變而改變。
基本 URL 確定如下：
- 默認情況下，基本 URL 是檔案的位置（由 window.location 確定）。
- 如果是 HTML 檔案并且檔案中有元素，則 使用第一個具有此類屬性
<base>的 Base 元素的 hrefvalue 。
轉載請註明出處，本文鏈接：https://www.uj5u.com/caozuo/459033.html
標籤：javascript html dom
上一篇：如何根據我們有多少標簽來設定和修改<tr>標簽的data-id屬性
下一篇：如何在php中正確傳遞頁面ID