{"type":"doc","content":[{"type":"paragraph","content":[{"text":"You can make a Javascript sandbox by creating an index.html file in a directory with another file with a .js extension ","type":"text"},{"text":"with a text editor","type":"text","marks":[{"type":"link","attrs":{"href":"/wiki/spaces/EC/pages/2092597274"}}]},{"text":". Here’s the HTML content:","type":"text"}]},{"type":"codeBlock","attrs":{"language":"html"},"content":[{"text":"\n\n\n\n\n

Hello World of Javascript

Here is some text.

And a div!

A list item.
Another list item.

\n\n","type":"text"}]},{"type":"paragraph","content":[{"text":"Here’s a little Javascript function which will put red outlines around your HTML elements. BTW it’s best practice to ","type":"text"},{"text":"separate Javascript and HTML like this","type":"text","marks":[{"type":"link","attrs":{"href":"/wiki/spaces/EC/pages/2089058433"}}]},{"text":".","type":"text"}]},{"type":"codeBlock","attrs":{"language":"javascript"},"content":[{"text":"function DEBUGborders(){\n console.log(\"Borders on\");\n var Element = document.createElement('style');\n document.head.appendChild(Element);\n var Sheet = Element.sheet;\n Sheet.insertRule(\"*{outline: 1px red solid;}\", 0);\n}","type":"text"}]},{"type":"paragraph","content":[{"text":"Open the index.html page in your browser and type in “DEBUGborders()” ","type":"text"},{"text":"at the console","type":"text","marks":[{"type":"link","attrs":{"href":"/wiki/spaces/EC/pages/2100232247"}}]},{"text":" and you should see something like this:","type":"text"}]},{"type":"mediaSingle","attrs":{"layout":"center"},"content":[{"type":"media","attrs":{"width":863,"id":"cb294414-4287-4566-9df8-c9257b89c594","collection":"contentId-2095350080","type":"file","height":892}}]},{"type":"paragraph"}],"version":1}

Browser not supported