Display html tags on a webpage

Please support our JavaScript / DHTML / AJAX advertiser: PostgreSQL or MySQL? Compare and contrast the two most popular open source databases
serkan sendur serkan sendur is offline Offline Mar 6th, 2009, 5:37 pm |
0
Displays the html tags without rendering on a webpage.
Quick reply to this message  
JavaScript / DHTML / AJAX Syntax
  1. <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
  2. <html xmlns="http://www.w3.org/1999/xhtml" >
  3. <head>
  4. <title>Untitled Page</title>
  5. <script type="text/javascript">
  6. function firstMethod()
  7. {
  8. var str = document.getElementById("tbl").innerHTML.replace(/[<]/g,'&lt;');
  9. str = str.replace(/[>]/g,'&gt;');
  10. document.getElementById("displayHTML").innerHTML = str;
  11. }
  12. function secondMethod()
  13. {
  14. document.getElementById("displayHTML").innerText = document.getElementById("tbl").innerHTML;
  15. }
  16. </script>
  17. </head>
  18. <body>
  19. <div id="displayHTML"></div>
  20. <table border="1" id="tbl">
  21. <tr>
  22. <td style="width: 100px">
  23. 1</td>
  24. <td style="width: 100px">
  25. 2</td>
  26. <td style="width: 100px">
  27. 3</td>
  28. </tr>
  29. <tr>
  30. <td style="width: 100px">
  31. 4</td>
  32. <td style="width: 100px">
  33. 5</td>
  34. <td style="width: 100px">
  35. 6</td>
  36. </tr>
  37. <tr>
  38. <td style="width: 100px">
  39. 7</td>
  40. <td style="width: 100px">
  41. 8</td>
  42. <td style="width: 100px">
  43. 9</td>
  44. </tr>
  45. </table>
  46. <input type="button" value="use conventional method" onclick="firstMethod()" />
  47. <input type="button" value="use serkan's method" onclick="secondMethod()" />
  48. </body>
  49. </html>
  50.  
  51. This is a good example of using javascript innerText property which is not
  52. as popular as innerHTML property.
0
Troy III Troy III is offline Offline | Sep 19th, 2009
JavaScript / DHTML / AJAX Syntax (Toggle Plain Text)
  1. #
  2. This is a good example of using javascript innerText property which is not
  3. #
  4. as popular as innerHTML property

Yeah, good old sanity method, -not supported by crippled "modern" browsers until yesterday!

In fact, firefox still dosn't - currently tested in fx 3.5.3 no error but no go either...
Last edited by Troy III; Sep 19th, 2009 at 10:45 pm.
 
0
serkan sendur serkan sendur is offline Offline | Sep 19th, 2009
So what?
 
0
Troy III Troy III is offline Offline | Sep 20th, 2009
How "what?"!!!

Your precious:
JavaScript / DHTML / AJAX Syntax (Toggle Plain Text)
  1. <input type="button" value="use serkan's method" onclick="secondMethod()" />
"SERKAN's METHOD" type of think - will NOT work in Fire-Fox and other Netscape lurking children of the internet.
- What "what" ?
Last edited by Troy III; Sep 20th, 2009 at 3:43 am.
 
0
serkan sendur serkan sendur is offline Offline | Sep 20th, 2009
if it does not work in those browsers, just find the substitute and post it to here instead of useless commenting.
 
1
digital-ether digital-ether is offline Offline | Sep 21st, 2009
Something like this should work:

JavaScript / DHTML / AJAX Syntax (Toggle Plain Text)
  1. /**
  2.  * Return html numeric entities encoded string
  3.  */
  4. String.prototype.toHtmlEntities = function() {
  5. return this.replace(/[^a-z0-9\.\-\_\s\t]/ig, function(c) {
  6. return '&#'+c.charCodeAt(0)+';';
  7. });
  8. };

Example:

JavaScript / DHTML / AJAX Syntax (Toggle Plain Text)
  1. '<div>This & that</div>'.toHtmlEntities();

It replaces every non-alphabetic and numeric character (excluding a few defined in the regex pattern) with their character codes.
 
 

Message:


Thread Tools Search this Thread



About Us | Contact Us | Advertise | DaniWeb | Acceptable Use Policy | RSS Feed

©2003 - 2009 DaniWeb® LLC