Link to home
Start Free TrialLog in
Avatar of eNarc
eNarcFlag for United Kingdom of Great Britain and Northern Ireland

asked on

how to put html code not display in web page but as code itself

Hi, I'm wanting to put code on a webpage without affecting the web page layout though still displaying the actual code on the web page. is it possible to do this?
Avatar of experts1
experts1

Try example below:
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=windows-1252">
<title>New Page 1</title>
<script language="javascript">
function myHTML()
{
  var ct = "<input type='button' value='Click' onclick='myHTML();'>";
  document.getElementById("mydiv").innerText = ct;
}
</script>
</head>
<body id="mybody">
<input type="button" value="Click" onclick="myHTML();">
<br>
<div id="mydiv">
</div>
</body>
</html>

Open in new window

Avatar of eNarc

ASKER

that didn't work.

when I put this below it just showed the textarea.

<script language="javascript">
function myHTML()
{
  var ct = "<textarea><input type='button' value='Click' onclick='myHTML();'></script><textarea>";
  document.getElementById("mydiv").innerText = ct;
}
</script>
</head>
<body id="mybody">
<input type="button" value="Click" onclick="myHTML();">
<br>
<div id="mydiv">
</div>

Open in new window

You inserted a premature "</script>" in your javascript code
which cause error, premature end of script:

var ct = "<textarea><input type='button' value='Click' onclick='myHTML();'></script><textarea>";
Avatar of eNarc

ASKER

though thats what I'm saying it doesn't just show the code it changes the layout.
Hi,

You may have to try the following code!

 <div>
        &lt;input type="text" /&gt;
    </div>

Open in new window


Hope it helps u...
Avatar of hielo
If you are going to "embed" <script> OR </script> within the dynamic string, you will need to "break" the <script> into separate strings and then join them.  To clarify, if you want:
<script type='text/javascript'>  you will need to use "...<scr" + "ript type='text/javascript'>..."

Likewise:
</script>  you will need to use "...</scr" + "ript>..."

Otherwise the parser "thinks" that you are trying end the actual script block (instead of just appending some text the spells out "<script>".  Also, escape the < and the > characters (see attached code).

<script language="javascript">
function myHTML()
{
  var ct = "<textarea><input type='button' value='Click' onclick='myHTML();'><scr"+"ipt type='text/javascript'>...</"+"script><textarea>";
  document.getElementById("mydiv").innerHTML = ct.replace(/([<>])/g,function(m,c){return '&#'+c.charCodeAt(0)+';';});
}
</script>
</head>
<body id="mybody">
<input type="button" value="Click" onclick="myHTML();">
<br>
<div id="mydiv">
</div>

Open in new window

Try

document.getElementById("mydiv").value = ct;

HTH
Ashok
In other words, you have to escape some characters
as follows:

Note: "/" is escaped by using "\/",  and code should work!
var ct = "<textarea><input type='button' value='Click' onclick='myHTML();'>[b]<\/script>[/b]<textarea>"; 

Open in new window

ASKER CERTIFIED SOLUTION
Avatar of eNarc
eNarc
Flag of United Kingdom of Great Britain and Northern Ireland image

Link to home
membership
This solution is only available to members.
To access this solution, you must be a member of Experts Exchange.
Start Free Trial
Avatar of eNarc

ASKER

is the correct answer.