The parent element containing the slot
The HTMLImageElement if found, null otherwise
// HTML: <my-component><img slot="hero" src="hero.jpg" /></my-component>
const component = document.querySelector('my-component');
const heroImage = getImageFromSlot({
element: component,
slotRef: 'hero'
});
// Returns the img element
// Also works with nested images
// HTML: <my-component><div slot="hero"><img src="hero.jpg" /></div></my-component>
const nestedImage = getImageFromSlot({
element: component,
slotRef: 'hero'
});
// Returns the img element inside the div
Retrieves an image element from a named slot in a Shadow DOM component
Searches for an element with the specified slot name and returns the image, whether the slotted element itself is an image or contains an image child. Returns null if no image is found.