The JavaScript Source: Generators: HTML2XHTML

Home

HTML2XHTML

The H2X converter generates a well-formed XHTML string from an HTML DOM object. H2X could be used in content management systems, online WYSIWYG HTML editors or any other application to produce well formed XHTML 1.0 code.

html:

<STYLE type=text/css>.top {

BORDER-RIGHT: #33ff33 1px solid; BORDER-TOP: #33ff33 1px solid; BORDER-LEFT: #33ff33 1px solid; BORDER-BOTTOM: #33ff33 1px solid; BACKGROUND-COLOR: #c8c4bb

}

.bottom {

BORDER-RIGHT: #ff3333 1px solid; BORDER-TOP: black 0px solid; BORDER-LEFT: #ff3333 1px solid; BORDER-BOTTOM: #ff3333 1px solid; BACKGROUND-COLOR: #d4d0c8

}

.nav:hover {

FONT-WEIGHT: bold; FONT-SIZE: 10px; COLOR: #666666; FONT-FAMILY: Verdana, Arial, Helvetica, sans-serif; TEXT-DECORATION: underline

}

.nav {

FONT-WEIGHT: bold; FONT-SIZE: 10px; COLOR: #666666; FONT-FAMILY: Verdana, Arial, Helvetica, sans-serif; TEXT-DECORATION: none

}

.text {

FONT-SIZE: 10px; COLOR: #333333; FONT-FAMILY: Verdana, Arial, Helvetica, sans-serif

}

</STYLE>

<P><FONT size=6><FONT face=Verdana><STRONG><FONT color=#6633ff><FONT color=#ff6633>R</FONT>ich <FONT color=#ff6633>E</FONT>ditor</FONT>!</STRONG></FONT></FONT><BR>

<TBODY>

<TR>

<TD>

<UL>

<LI><FONT color=#cc6633><FONT face="Courier New" size=2>Create <EM>images</EM>, <EM>tables</EM>; right click to edit it!</FONT> </FONT>

<LI><FONT face="Courier New" size=2><FONT color=#cc6633>Use RE in your forms instead <STRONG>textarea</STRONG></FONT></FONT></LI></UL></TD></TR></TBODY></TABLE></P>

<P><SPAN class=nav>Full <SPAN class=header>stylesheet</SPAN> support available!</SPAN><SPAN class=special> Now RE works with <SPAN class=header>FLASH</SPAN>!</SPAN></P>

xhtml:

convert whole page

The JavaScript Source: BG Effects: HTML2XHTML
Simply click inside the window below, use your cursor to highlight the script, and copy (type Control-c or Apple-c) the script into a new file in your text editor (such as Note Pad or Simple Text) and save (Control-s or Command-s). The script is yours!!!

  <HEAD>     <script language="JavaScript" src="html2xhtml.js"></script> <script language="JavaScript"> // this variables are necessary for the demo only //encoding parameters var lang = "en"; var encoding = "iso-8859-1"; //determine IE version var ie_data = navigator.userAgent.match(/MSIE ([0-9|\.]+)/); var ie_version = null; if (ie_data) { ie_version = parseFloat(ie_data[1]); } var can_parse = false; // this variables are necessary for the demo only function write2iframe(){ var page_mode = get_page_mode(); //* //get html text to convert var text2set = document.getElementById('html2convert_source').value; if (!page_mode) text2set = '<html><body>'+text2set+'</body></html>'; //write the text to iframe to access it later via dom object if (document.all) { var iframe_doc = html2convert.document; } else { var iframe_doc = document.getElementById('html2convert').contentWindow.document; } if (document.all && ie_version < 5.5) { //ie5.0 could generates onload event earlier then loading is actually finished iframe_doc.onload = setTimeout('parse_iframe()', 1); } iframe_doc.open(); iframe_doc.write(text2set); iframe_doc.close(); } //convert html to xhtml and write to destination textarea function parse_iframe(){ if (!can_parse) return; var page_mode = get_page_mode(); //determine source dom object if (document.all) { var iframe_doc = html2convert.document; } else { var iframe_doc = document.getElementById('html2convert').contentWindow.document; } if (page_mode) { var source_obj = iframe_doc; } else { if (document.all) { var source_obj = iframe_doc.body; //html fragment ie } else { var source_obj = iframe_doc.documentElement; //html fragment mozilla } } var xhtml_content = get_xhtml(source_obj, lang, encoding); if (document.all) { html2convert_result.value = xhtml_content; } else { document.getElementById('html2convert_result').value = xhtml_content; } } //allow to convert if the whole document is loaded only function init(){ can_parse = true; } function get_page_mode(){ if (document.all) { return page_mode.checked; } else { return document.getElementById('page_mode').checked; } } </script> </HEAD>  <BODY onLoad="init()">       html:<br /> <textarea id="html2convert_source" rows="13" cols="80"> <STYLE type=text/css>.top { BORDER-RIGHT: #33ff33 1px solid; BORDER-TOP: #33ff33 1px solid; BORDER-LEFT: #33ff33 1px solid; BORDER-BOTTOM: #33ff33 1px solid; BACKGROUND-COLOR: #c8c4bb } .bottom { BORDER-RIGHT: #ff3333 1px solid; BORDER-TOP: black 0px solid; BORDER-LEFT: #ff3333 1px solid; BORDER-BOTTOM: #ff3333 1px solid; BACKGROUND-COLOR: #d4d0c8 } .nav:hover { FONT-WEIGHT: bold; FONT-SIZE: 10px; COLOR: #666666; FONT-FAMILY: Verdana, Arial, Helvetica, sans-serif; TEXT-DECORATION: underline } .nav { FONT-WEIGHT: bold; FONT-SIZE: 10px; COLOR: #666666; FONT-FAMILY: Verdana, Arial, Helvetica, sans-serif; TEXT-DECORATION: none } .text { FONT-SIZE: 10px; COLOR: #333333; FONT-FAMILY: Verdana, Arial, Helvetica, sans-serif } </STYLE> <P><FONT size=6><FONT face=Verdana><STRONG><FONT color=#6633ff><FONT color=#ff6633>R</FONT>ich <FONT color=#ff6633>E</FONT>ditor</FONT>!</STRONG></FONT></FONT><BR> <TABLE style="WIDTH: 100%" borderColor=#6600ff cellSpacing=0 cellPadding=0 bgColor=#ccffff border=2> <TBODY> <TR> <TD><IMG style="WIDTH: 259px; HEIGHT: 32px" src="http://www.richarea.com/demo_rich/files/apache_pb.gif"></TD> <TD> <UL> <LI><FONT color=#cc6633><FONT face="Courier New" size=2>Create <EM>images</EM>, <EM>tables</EM>; right click to edit it!</FONT> </FONT> <LI><FONT face="Courier New" size=2><FONT color=#cc6633>Use RE in your forms instead <STRONG>textarea</STRONG></FONT></FONT></LI></UL></TD></TR></TBODY></TABLE></P> <P><SPAN class=nav>Full <SPAN class=header>stylesheet</SPAN> support available!</SPAN><SPAN class=special> Now RE works with <SPAN class=header>FLASH</SPAN>!</SPAN></P> </textarea> <br /> xhtml:<br /> <textarea id="html2convert_result" rows="13" cols="80"> </textarea> <br /> <iframe id="html2convert" onload="parse_iframe();" style="width:1px;height:1px;display:snone;visibility:hidden"> </iframe><br /> <input id="page_mode" type="checkbox" value="1"><label for="page_mode">convert whole page</label></input> <input type="button" onclick="write2iframe();" value="html => xhtml" /> <p><center> <font face="arial, helvetica" size"-2">Free JavaScripts provided<br> by <a href="http://javascriptsource.com">The JavaScript Source</a></font> </center><p> 
Did you use this script? Do you like this site? Please link to us!