loadhtml()

Global function that replaces the content (inner html) of each matched element in the result set, alternatively load the data into a variable. The location should be an URL or a relative file path.

loadhtml(location)

Loads all HTML from the HTML file.

location

String containing a path that can be absolute or relative to the section/context. Use: snippets/<snippet-name> to retrieve the content from a HTML file residing in the Snippets folder on the Resources panel.

Examples

This script loads a local HTML snippet (from the Resources panel) directly into the matched elements

results.loadhtml("snippets/snippet.html");

The following script loads a local HTML snippet (Resources panel) into a variable. The replaceWith() command is used to replace the element(s) matched by the script's selector with the contents of the snippet.

var mysnippet = loadhtml('snippets/snippet.html'); 
results.replaceWith(mysnippet);

Same result as the previous script, but a different notation:

results.replaceWith(loadhtml('snippets/snippet.html'));

The following script loads a snippet into a variable and finds/replaces text in the variable before inserting the content into the page. The second find command also adds formatting to the replacing text.

var mysnippet = loadhtml('snippets/snippet.html'); 
mysnippet.find('@var1@').text('OL Connect 1'); 
mysnippet.find('@var2@').html('<i>OL Connect 2</i>').css('text-decoration','underline'); 
results.replaceWith(mysnippet);

This last script loads a snippet into a variable and retrieves an element from the snippet using query().

var mysnippet = loadhtml('snippets/text-root-wrapped.html'); 
var subject = query("#subject", mysnippet).text(); 
results.append("<p style='font-weight: bold;'>" + subject + "</p>");

loadhtml(location, selector)

Retrieve specific content from the filename.

location

String; the location can be absolute or relative to the section/context. Use: snippets/<snippet-name> to retrieve the content from a HTML file residing in snippets folder of the Resources panel.

selector

String. The supplied selector should conform to CSS selector syntax and allows you to retrieve only the content of matching elements.

Examples​​

This script loads a specific element from the snippet.

var mysnippet = loadhtml('snippets/snippet-selectors.html','#item3'); 
results.replaceWith(mysnippet);

This script loads the children of the selected element.

var snippet = loadhtml('snippets/snippet.html','foobar').children(); 
results.replaceWith(snippet);

Another example is given in the following how-to: Using a selector to load part of a snippet.