Re: Javascript will not allow to wright() html - CSS-Tricks

July 24, 2010 at 6:36 am #80316

Participant

I solved it.
It was only a mather of switching .innerHTML to .value

Code:

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

<html xmlns="http://www.w3.org/1999/xhtml">

<head>

<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />

<title>Untitled Document</title>
    <script type="text/javascript">

        function populateIframe() {

            var ifrm = document.getElementById(‘myIframe’);

			var userInput = document.getElementById(‘iframestuff’).value;

            ifrm = (ifrm.contentWindow) ? ifrm.contentWindow : (ifrm.contentDocument.document) ? ifrm.contentDocument.document : ifrm.contentDocument;

            ifrm.document.open();

            ifrm.document.write(document.getElementById(‘iframestuff’).value = userInput);

            ifrm.document.close();

			ifrm.document.body.contentEditable = ‘true’;

        }
		function DoCopy (iframestuff, myIframe) {

		if (window.frames && window.frames[myIframe] &&

		window.frames[myIframe].document &&

		window.frames[myIframe].document.body &&

		window.frames[myIframe].document.body.innerHTML) {

			iframestuff.value = window.frames[myIframe].document.body.innerHTML;

			}

		}

    </script>
</head>
<body>

<div id="main">

	<form>

        <div id="html">

            <textarea id="iframestuff">Yo world!</textarea>

            <input type="button" value="submit" onclick="populateIframe();" />

        </div>

        <div id="iframe">

            <iframe id="myIframe">

            </iframe>

        </div>
			<input type="button" value="Copy" onclick="DoCopy(form.iframestuff, ‘myIframe’)" />

    </form>

</div>

</body>

</html>

I also made a script that takes the HTML from the iframe and converts it back to html in the texarea.

But now I got another problem. When I make a double <br/><br/> I thougt that I’ll get a <p> tag, but instead i got a <div><br/></div><div><br/></div> for eatch of the <br/> tags.

So my question is. Is it possible to convert <div><br/></div><div><br/></div> to a <p> tag using JavaScript?

I’m not a code monkey so I have been working my way through internet to find a script that does this but it was hard to find.

Tanks in advance.