Dynarch.com - Professional AJAX Development

JS Calendar HTMLArea Hire Mishoo Contact

Home → HTMLArea

Releases

Jun 23
JSCal2-1.6
Jun 19
JSCal2-1.5
May 07
JSCal2-1.0

Latest comments

HTMLArea — Online HTML Editor

This product is no longer maintained but it still works pretty well. This page is mostly here for historical reasons—if you need an HTML editor it's better to use one that it's still in development. Xinha is the direct descendant of HTMLArea (“Xinha” stands for “Xinha Is Not HtmlArea”) and it's pretty cool, but h-u-g-e. In any case, I congratulate the developers that took over from me, when I failed to properly maintain it.

In case you do want to use it, you can download the last HTMLArea here. And of course, feel free to drop a line in this page if you love me or hate me.

License

HTMLArea is (c) interactivetools.com 2002-2004, (c) Dynarch.com 2003-2005. Distributed under a BSD-style license (see license.txt if you download it).

Sample

<!DOCTYPE HTML PUBLIC "-//IETF//DTD HTML 3.2//EN">
<html>

<head>
<title>Passing parameters to JavaScript code</title>
<link rel="stylesheet" href="custom.css" />
</head>

<body>
<h1>Passing parameters to JavaScript code</h1>

Sometimes we need to pass parameters to some JavaScript function that we
wrote ourselves. But sometimes it's simply more convenient to include the
parameter not in the function call, but in the affected HTML elements.
Usually, all JavaScript calls affect some element, right? ;-)

Well, here's an original way to do it. Or at least, I think it's
original.

<h2>But first...</h2>

... an example. Why would I need such thing? I have a JS function that
is called on <code>BODY</code> <code>onload</code> handler. This function
tries to retrieve the element with the ID "conttoc" and, if present, it will
<a href="toc.epl" title="Automatic TOC generation">generate an index</a>.
The problem is, this function exists in some external JavaScript library
that it's loaded in page. I only needed to pass the parameter from
one page. Thus, it makes sense to pass the parameter from the HTML
code on that page, not to affect the others.

The first idea that came to me was to use some attribute, like "id" or
"class". But "id" was locked already, it had to be "conttoc". Use
"class"? It's not elegant.. what if I really wanted to give it a class, at
some point?

So I thought: what are the HTML elements that do not affect the page
rendering in any way? Well, comments. I mean, comments, HTML
comments. You know, like <code>&lt;!-- this is a comment --&gt;</code>.

Though comments do not normally affect the way browser renders the page,
they are still parsed and are part of the DOM, as well as any other node.
But this mean that we can access comments from JavaScript code, just like we
access any other element, right? Which means that they can affect
the way that page finally appears ;-)

The main part was the idea. The code is simple ;-) Suppose we have the
following HTML code:

<pre class="code">&lt;div id=&quot;conttoc&quot;&gt;&lt;/div&gt;</pre>

and our function checks for the presence an element having the ID
"conttoc", and generates a table of contents into it. Our code will also
check if the "conttoc" element's first child is a comment node, and if so
will parse additional parameters from there, for instance, a desired prefix
for the links that are to be generated into it. Why did I need it? Because
if the page uses a <code>&lt;base&gt;</code> element to specify the default
link prefix, then links like "#gen1" generated by the <a href="toc.epl">toc
generator</a> will not point to that same page as they should, but to the
page reffered from <code>&lt;base&gt;</code>.

So the HTML would now look like this:

<pre class="code">&lt;div id=&quot;conttoc&quot;&gt;&lt;!-- base:link/prefix.html --&gt;&lt;/div&gt;</pre>

And our TOC generation function does something like this:

<pre class="code">var element = getElementById(&quot;conttoc&quot;);
if (element.firstChild &amp;&amp; element.firstChild.nodeType == 8) {
 // 8 means Node.COMMENT_NODE. We're using numeric values
 // because IE6 does not support constant names.
 var parameters = element.firstChild.data;
 // at this point &quot;parameters&quot; contains base:link/prefix.html
 // ...
}</pre>

So we retrieved the value passed to the script from the HTML code. This
was the goal of this article.

<hr />
<address><a href="http://students.infoiasi.ro/~mishoo/">Mihai Bazon</a></address>
 Last modified on Thu Apr 3 20:34:17 2003


</body>
</html>

21 comments so far (add yours)

reply »

Re: HTMLArea — Online HTML Editor

by old joe

2009-03-29 04:16

thank you very much!

reply »

Re: HTMLArea — Online HTML Editor

by George Leon

2009-04-09 15:11

Thanks

reply »

Re: HTMLArea — Online HTML Editor

by Mohamed Jbeli

2009-04-14 20:22

Good Job Buddy

reply »

Re: HTMLArea — Online HTML Editor

by anto

2009-04-20 13:24

Thanks, it's just i want

reply »

Re: HTMLArea — Online HTML Editor

by Hoàng văn Hòa

2009-04-24 09:58

help me. I want insert media

reply »

Re: HTMLArea — Online HTML Editor

by Robert Rohit

2009-04-29 13:34

Thanks for you nice site. Above code is really meaningful. Thanks Again

reply »

Re: HTMLArea — Online HTML Editor

by ethansp

2009-05-01 09:52

good one

reply »

Re: HTMLArea — Online HTML Editor

by J~

2009-05-08 15:44

Very nice job! Congratulations!

reply »

Re: HTMLArea — Online HTML Editor

by Janice Kong

2009-05-14 06:09

Thanks so much! I have been looking for ordered list that can change numbers to roman but can't find any. This is what I want!

reply »

10.

HTMLArea — Online HTML Editor

by s4crificed

2009-05-18 11:39

It's not working in opera. Js don't load

reply »

11.

HTMLArea — Online HTML Editor

by deapge

2009-05-23 19:39

谢谢

reply »

12.

HTMLArea — Online HTML Editor

by Science HUB

2009-05-27 17:19

Thanks for sharing...

reply »

13.

HTMLArea — Online HTML Editor

by alexander

2009-05-27 19:39

solo necwsito el codigo del calendario para colcoarlo en mi pagina web, como hago para ver solo el codigo del calendario

reply »

14.

HTMLArea — Online HTML Editor

by Andrea

2009-06-05 12:20

Thank you very much!!

reply »

15.

HTMLArea — Online HTML Editor

by Raif

2009-06-07 16:37

I have a problem with bold text.

reply »

16.

HTMLArea — Online HTML Editor

by Vi

2009-06-09 16:00

How do you stop the popup window from appearing after the page is submitted or leaving the page?

reply »

17.

HTMLArea — Online HTML Editor

by fireskyit

2009-06-12 20:38

Hi ! How do use it ? How do add it to a project ? you could present to use ? thanks !

reply »

18.

HTMLArea — Online HTML Editor

by giakan

2009-06-12 20:41

Me too ! I Don't know , how do use it. please help me !

reply »

19.

HTMLArea — Online HTML Editor

by Yvan

2009-06-12 22:52

I can't seem to figure out how to configure the toolbar for the editor. Here's what I have for may javascript:

I found an example in the reference docs, but when I try to incorporate it into my script, the code seems to be being ignored, as my editor's toolbar doesn't change. Please advise.

Thanks, - Yvan

reply »

20.

HTMLArea — Online HTML Editor

by from china

2009-06-14 08:06

谢谢! (Thank You!)

reply »

21.

HTMLArea — Online HTML Editor

by Ahnphi

2009-06-14 20:53

How do I rewrite script in my conditions file?? I am trying to change http to https?? Not too knowledgeable on building website.

Add your comment You can use the MultiMarkdown syntax, with some decent restrictions (no plain HTML, no headings). Your email address will not be published.

* Your name:
Your website:
Your email address:
Subject:
* Message:
	Send me an email notification on replies
	Remember me