Home > Developer > JavaScript
1. What is an HTML online editor?
As the name suggests, an online editor is a tool used for online editing. The edited content is HTML-based documents.
2. What is the use of the HTML online editor?
Because the HTML online editor can be used to edit HTML-based documents online, it is often used for message board messages, Forum posts, Blog writing logs, or other places where users need to enter common HTML.
3. What is DHTML?
DHTML is the integration of some existing web technologies and standards. Through it, webpage design can be used to create webpages in a new way.
4. Relationship between DHTML and HTML
DHTML is based on the HTML language. However, compared with the Web page design method based on pure HTML, the biggest transformation brought about by HTML is that it adds the "object-oriented" Web page features. The Dynamic HTML object model defines the objects used to describe the webpage and its internal elements. Each object has attributes that describe its own State and methods to describe its behavior, they can also process specific types of events, so web designers can control or call these objects through Script programs.
5. Relationship between DHTML and HTML online editor
DHTML is required for an online editor. to edit an HTML online editor online, you must dynamically change the attributes of the webpage object. DHTML meets this requirement.
What are HTML online editors?
Http://www.cnbruce.com/blog/showlog.asp? Cat_id = 27 & log_id = 1021
Basic Principles of HTML online editor
Reproduced from: http://www.lfda.gov.cn/bbsxp/ShowPost.asp? ThreadID = 692
After reading the popular online editor on the internet, I cannot help but want to understand the principle. The most widely used eWebEdit, which is the most popular open-source online editor I have ever seen. After studying it for a day, I finally learned the Core Principles.
First, explain the principles of the Online Editor: first, support for IE5.0 and later versions is required. Because IE5.0 and later versions have an editing status, you can enter text in an iframe. Then, you can use "document. body. innerHTML" to obtain the html code in iframe. This is the key. Then how can we make ifrmae in the editing status? You can use:
Function document. onreadystatechange ()
{
HtmlEdit.doc ument. designMode = "On ";
}
Function implementation. The remaining problem is to get the focus and the selected value:
HtmlEdit. focus ();
Var sel = HtmlEdit.doc ument. selection. createRange ();
The preceding two sentences can be used to obtain the html code of the selected value.
Here, the basic principles are clarified. Then we can use the insertHTML ("str") method to replace the selected values with html characters. Here is a simple demo to demonstrate an online editor with only the BOLD effect. Here I use a textarea to obtain the html value in iframe. In actual situations, we can set the display of textarea to false, and then we can submit the content of iframe.
<Html> <pead> <meta http-equiv = "Content-Type" content = "text/html; charset = gb2312 "> </pead> <body> </ptml>
[Ctrl + A select all Note: If you need to introduce external Js, You need to refresh it to execute]
Start building with 50+ products and up to 12 months usage for Elastic Compute Service
1 on 1 presale consultation
24/7 Technical Support 6 Free Tickets per Quarter Faster Response
Alibaba Cloud offers highly flexible support services tailored to meet your exact needs.
A comprehensive suite of global cloud computing services to power your business
Payment Methods We Support
