Add HTML5 sandbox attribute to an iframe using Javascript

Question

I've got an empty iframe and a button:

<input type="button" name="B1" value="google" onclick="frames['IFrameName1'].location.href='https://www.google.com/'">

But (besides .location.href) i need to set the attribute sandbox="allow-forms allow-scripts allow-same-origin, because the framed site "deframes". How to set location AND sandbox?

Answer 1

While you can set the iframe.sandbox property as a string, it's technically a DOMTokenList interface, so you can also add() and remove() single tokens:

let myIframe = document.createElement('iframe');
myIframe.sandbox.add('allow-scripts');
myIframe.sandbox.toggle('allow-forms');

console.log(myIframe.sandbox.toString())
// Returns: "allow-scripts allow-forms"

console.log(myIframe.outerHTML)
// Returns: <iframe sandbox="allow-scripts allow-forms"></iframe>