web api interface
RestrictionTarget
Limited availability
The RestrictionTarget interface of the Screen Capture API provides a static method, fromElement(), which returns a RestrictionTarget instance that can be used to restrict a captured video track to a specified DOM element.
Static methods
fromElement()Experimental- : Returns a
RestrictionTargetinstance that can be used to restrict a captured video track to a specified DOM element (plus its descendants).
- : Returns a
Examples
// Options for getDisplayMedia()
const displayMediaOptions = {
preferCurrentTab: true,
};
// Create restriction target from DOM element
const demoElem = document.querySelector("#demo");
const restrictionTarget = await RestrictionTarget.fromElement(demoElem);
// Capture video stream from user's webcam and isolate video track
const stream =
await navigator.mediaDevices.getDisplayMedia(displayMediaOptions);
const [track] = stream.getVideoTracks();
// Restrict video track
await track.restrictTo(restrictionTarget);
// Broadcast restricted stream in <video> element
videoElem.srcObject = stream;
See Using the Element Capture and Region Capture APIs for in-context example code.
Specifications
SpecificationsStandards references are available on the canonical MDN page.
Browser compatibility
Browser compatibilityCompatibility data is available on the canonical MDN page.