Run results for: Create DOM nodes 3

Run details:

User agent: Mozilla/5.0 (Macintosh; Intel Mac OS X 10_15_7) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/93.0.4577.63 Safari/537.36

Browser: Chrome 93

Operating system: Mac OS X 10.15.7

Device Platform: Desktop

Date tested: 3 years ago

Tests:

Fragment
const html = ` <div> <ul> <li id="component">Hello</li> </ul> </div> ` const fragment = document .createRange() .createContextualFragment(html) .getElementById('component') console.log(fragment)
Template 1
const html = ` <div> <ul> <li id="component">Hello</li> </ul> </div> ` const template = document.createElement('template') template.innerHTML = html const template1 = Array(3).fill().reduce((template, current) => template.firstElementChild, template.content) console.log(template1)
Template 2
const html = ` <div> <ul> <li id="component">Hello</li> </ul> </div> ` const template = document.createElement('template') template.innerHTML = html const template2 = template.content.getElementById('component') console.log(template2)
Parser
const html = ` <div> <ul> <li id="component">Hello</li> </ul> </div> ` const parser = new DOMParser().parseFromString(html, 'text/html').getElementById('component') console.log(parser)