RestrictionTarget
Limited availability
This feature is not Baseline because it does not work in some of the most widely-used browsers.
Experimental:This is anexperimental technology
Check theBrowser compatibility table carefully before using this in production.
TheRestrictionTarget interface of theScreen Capture API provides a static method,fromElement(), which returns aRestrictionTarget instance that can be used to restrict a captured video track to a specified DOM element.
In this article
Static methods
fromElement()ExperimentalReturns a
RestrictionTargetinstance that can be used to restrict a captured video track to a specified DOM element (plus its descendants).
Examples
js
// Options for getDisplayMedia()const displayMediaOptions = { preferCurrentTab: true,};// Create restriction target from DOM elementconst demoElem = document.querySelector("#demo");const restrictionTarget = await RestrictionTarget.fromElement(demoElem);// Capture video stream from user's webcam and isolate video trackconst stream = await navigator.mediaDevices.getDisplayMedia(displayMediaOptions);const [track] = stream.getVideoTracks();// Restrict video trackawait track.restrictTo(restrictionTarget);// Broadcast restricted stream in <video> elementvideoElem.srcObject = stream;SeeUsing the Element Capture and Region Capture APIs for in-context example code.
Specifications
| Specification |
|---|
| Element Capture> # dom-restrictiontarget> |