Namespace: Requests:createHtmlRequest

Requests:createHtmlRequest

Methods

createHtmlRequest(url, optionsopt, nullable, useNativeopt, strictopt, nullable) → {Requests.HtmlFetchRequest}

This method creates a special version of a FetchRequest specifically designed to retrieve HTML content.

Usually you'll want to retrieve HTML to include it into a page or extract information from it, so the default mode of this method is to resolve to a node, you may insert into the DOM wherever you please or use stuff like a querySelector on. However, you may also specify to retrieve the raw HTML source.

Be aware, that requesting and parsing HTML from an unsecure source comes with a high risk. If you cannot fully trust the source, request the HTML raw and use something like dom purify before using the result.

If you plan on inserting the result into DOM anyway you'll like the fact that this is also directly possible, by defining an insert target.

BTW: Inserting does not automatically change the resolve value, those are separate concerns.

Parameters:
Name Type Attributes Default Description
url String

the complete URL to query

options Object <optional>
<nullable>
null

the request options (see: createFetchRequests for details)

useNative Boolean | String <optional>
false

determines if the native Fetch implementation of the browser should be used, true forces usage, "auto" uses it only if available

strict Boolean <optional>
<nullable>
true

if true, enforces "text/html" as accept header as well as response mime type, if false, accept header is not set and different mime type only results in warning

Source:
See:
Throws:

error in strict mode if response content type is not "text/html"

Returns:
use this via the "execute" method, which resolves to a FetchResponse or rejects with error in case of a technical request error (request is not completable)
Type
Requests.HtmlFetchRequest
Example
createHtmlRequest('/html/test.html')
    .execute()
        .then(htmlElement => { document.body.appendChild(htmlElement); })
;
createHtmlRequest('/html/test.html')
    .execute('raw', null, 'request-1')
        .then(rawHtml => { alert(`document has been loaded: "${rawHtml}"`); })
;
createHtmlRequest('/html/test.html')
    .execute(null, injectTarget, 'request-3', 'body > main > h1')
        .then(htmlElement => { alert(`has been injected: "${htmlElement.outerHTML}"`); })
;
createHtmlRequest('/files/html/requests-test-1.html')
    .execute('raw', {element : injectTarget, position : 'beforebegin'}, 'request-4', 'h1 ~ p', true)
        .then(rawHtml => { alert(`has been injected: "${rawHtml}"`); })
;
createHtmlRequest('/files/html/requests-test-2.html')
    .execute('element', {element : injectTarget, position : 'prepend'}, 'request-5', 'p', true)
        .then(htmlElements => { alert(`has been injected: "${htmlElements.map(e => e.outerHTML).join('')}"`); })
;