sandbox
sandbox attribute
The sandbox
attribute on an <iframe>
enhances security by limiting features such as scripts and forms. Certain permissions can be granted by using space-separated tokens.
Syntax
<iframe src="url" sandbox="value1 value2"></iframe>
Example
Here’s an example of how to apply the sandbox
attribute to an <iframe>
:
<iframe src="https://institute.qarpeo.com" sandbox="allow-scripts allow-popups"></iframe>
- In this example, the
<iframe>
allows scripts and popups, while other actions are restricted to ensure security.
Values
Here’s a concise list of possible values for the sandbox
attribute.:
- allow-forms: Allows form submissions.
- allow-modals: Permits modal windows.
- allow-orientation-lock: Allows screen orientation locking.
- allow-pointer-lock: Allows pointer lock requests.
- allow-popups: Allows popups to open.
- allow-popups-to-escape-sandbox: Allows new windows to open without restrictions.
- allow-presentation: Allows the initiation of presentations.
- allow-same-origin: Treats the content as same origin.
- allow-scripts: Enables JavaScript execution.
- allow-top-navigation: Allows navigation to the top-level context.
- allow-top-navigation-by-user-activation: Top-level navigation only with user interaction.
- allow-presentation: Starts presentation sessions.
- allow-same-origin: Treats content as same origin.
- allow-scripts: Runs JavaScript.
- allow-top-navigation: Navigates top-level context.
- allow-top-navigation-by-user-activation: Top-level navigation with user interaction.
Conclusion
The sandbox
attribute in HTML is a crucial security feature for <iframe>
elements, enabling developers to restrict actions such as running scripts or opening popups. It improves web security by limiting potentially harmful content. Developers can grant specific permissions using tokens, balancing security with necessary functionality.
preload
The preload attribute in HTML specifies whether and how the browser should preload media content for `<audio>` and `<video>` elements before playback begins.
usemap
The usemap attribute in HTML associates an image with an image map, enabling certain regions of the image to be clickable and guiding users to different destinations.