create a web page with javascript on fly

D

datactrl

Hi,

Is that posible to create a web page completely with javascript and open it
without request to server? Please show a simple sample. Thanks in advance!

Jack
 
L

Lee

datactrl said:
Hi,

Is that posible to create a web page completely with javascript and open it
without request to server? Please show a simple sample. Thanks in advance!
Click to expand...

Sure it is, but it has to be loaded from someplace, and it's also very
simple to store a complete web page on the local disk. What, exactly,
are you looking for?
 
M

McKirahan

datactrl said:
Hi,

Is that posible to create a web page completely with javascript and open it
without request to server? Please show a simple sample. Thanks in advance!

Jack
Click to expand...

A Web page is delivered by a Web server....

Of course you can create a file with an .htm (or .html) extension and
double-click on it in Windows Explorer and it will open. No JavaScript is
necessary to do this; for example:

<html>
<head>
<title>test1.htm</title>
</head>
<body>
<h1>Hello World</h1>
</body>
</html>

You can create a page using JavaScript:

<html>
<head>
<title>test2.htm<title>
<script type="text/javascript">
var htm = "<html>";
htm += "<head>";
htm += "<title>test3.htm;
htm += "</head>";
htm += "<body>";
htm += "<h1>Hello World</h1>";
htm += "</body>";
htm += "</html>";
document.write(htm);
</script>
</head>
<body>
<h1>Hello World</h1>
</body>
</html>

Does this answer your question? If not please clarify.
 
M

McKirahan

McKirahan said:
A Web page is delivered by a Web server....

Of course you can create a file with an .htm (or .html) extension and
double-click on it in Windows Explorer and it will open. No JavaScript is
necessary to do this; for example:

<html>
<head>
<title>test1.htm</title>
</head>
<body>
<h1>Hello World</h1>
</body>
</html>

You can create a page using JavaScript:

<html>
<head>
<title>test2.htm<title>
<script type="text/javascript">
var htm = "<html>";
htm += "<head>";
htm += "<title>test3.htm;
htm += "</head>";
htm += "<body>";
htm += "<h1>Hello World</h1>";
htm += "</body>";
htm += "</html>";
document.write(htm);
</script>
</head>
<body>
<h1>Hello World</h1>
</body>
</html>

Does this answer your question? If not please clarify.
Click to expand...

Of course
htm += "<title>test3.htm;
should have been
htm += "<title>test3.htm</title>";


Here's another possibility.

var htm = "<html>";
htm += "<head>";
htm += "<title>test4.htm</title>";
htm += "</head>";
htm += "<body>";
htm += "<h1>Hello World</h1>";
htm += "</body>";
htm += "</html>";
var oIE = new ActiveXObject("InternetExplorer.Application");
oIE.visible = true;
oIE.navigate("about:blank");
oIE.document.open;
oIE.document.write(htm);
oIE.document.close;
 
D

datactrl

Thanks a lot, McKirahan. The last one is what I want. I would like to pop up
a web page which is completely created by the original page with javascript.
How about if I want to use showModelessDialog() to open it, is that
possible? Thanks again !

Jack
 
R

RobG

Have a search for a message subject "writing slabs of htm".
It was conclusively shown by Lasse that it is much quicker
to write HTML as elements in array, then use join("") to
concatenate them before writing to the page. The length of
time taken using += verus join() is exponentially longer,
getting seriously long for big pages.

There is an example of how to use it below.

Of course, if your content is only small...

Cheers, Rob.

<html>
<head>
<title>Slabs of HTML</title>
</head>
<body>
<script type="text/javascript">
var a = [];
var i = 0;
a[0] = " <p>here is paragraph " + i + "</p>";
a[++i] = " <p>here is paragraph " + i + "</p>";
a[++i] = " <p>here is paragraph " + i + "</p>";
a[++i] = " <table border='1' cellpadding='5' cellspacing='10'>";
a[++i] = " <tr>";
a[++i] = " <td>This is a cell</td>";
a[++i] = " <td>another cell</td>";
a[++i] = " </tr>";
a[++i] = " <tr>";
a[++i] = " <td>This is a cell</td>";
a[++i] = " <td>another cell</td>";
a[++i] = " </tr>";
a[++i] = " <tr>";
a[++i] = " <td colspan='2' align='center'>";
a[++i] = " <form name='fred' action=''>";
a[++i] = " <input type='text' name='aTxt' width='50'>";
a[++i] = " <input type='button' value='click me'"
+ "
onclick=\"alert(this.form.aTxt.value);\"><br>";
a[++i] = " <input type='reset' value='Reset'>";
a[++i] = " </form>";
a[++i] = " </td>";
a[++i] = " </tr>";
a[++i] = "</table>";

var s = a.join("");

document.write(s);

</script>
</body>
</html>
 
D

datactrl

Thank's Rob. My question is that I would like to popup a web page from an
already displayed page. And the popup page would like to be created from the
already displayed page with javascript. I think the way using
document.write() will change the content of already displayed page. That is
not the question.

I've tried 'new ActiveXObject("InternetExplorer.Application");' sample
provided by McKirahan. I think that would let me open an another window for
the created page. But I got an "automation error" when I run this sample.
Don't know what it is.

Jack
 
D

Dr John Stockton

JRS: In article <[email protected]>, dated Fri, 8
Oct 2004 05:27:16, seen in RobG
var a = [];
var i = 0;
a[0] = " <p>here is paragraph " + i + "</p>";
a[++i] = " <p>here is paragraph " + i + "</p>";
a[++i] = " <p>here is paragraph " + i + "</p>";
Click to expand...

If you use i++ rather than ++i, then the first line can have the same
LHS as the rest, and the first para will be paragraph 1 - ISTM.

How about
var s = [
" <p>here is paragraph " + 1 + "</p>",
" <p>here is paragraph 2 </p>",
" <p>here is paragraph 3 </p>",
...
"" ].join("") ;

taking the view that self-numbering paragraphs are probably not needed?

The empty string is to allow the previous line to end, like the rest,
with a comma, which seems nicer.

I've not tested for speed.
 
A

Andrey

datactrl said:
Thank's Rob. My question is that I would like to popup a web page from an
already displayed page. And the popup page would like to be created from the
already displayed page with javascript. I think the way using
document.write() will change the content of already displayed page. That is
not the question.
Click to expand...

If you want to open a modal dialog from the newly generated page, just include an onLoad evend in
<body> tag:

....
a[0] = "<body onLoad='javascript:showModalDialog(<your parameters>)'>"
....
I've tried 'new ActiveXObject("InternetExplorer.Application");' sample
provided by McKirahan. I think that would let me open an another window for
the created page. But I got an "automation error" when I run this sample.
Don't know what it is.
Click to expand...

It should be a security issue, if you run this from a web server, which is not on your local
machine. So if you want to have a web server where clients access remotely, you shouldn't use
ActiveXObject - just use document.write.

Jack


Have a search for a message subject "writing slabs of htm".
It was conclusively shown by Lasse that it is much quicker
to write HTML as elements in array, then use join("") to
concatenate them before writing to the page. The length of
time taken using += verus join() is exponentially longer,
getting seriously long for big pages.

There is an example of how to use it below.

Of course, if your content is only small...

Cheers, Rob.

<html>
<head>
<title>Slabs of HTML</title>
</head>
<body>
<script type="text/javascript">
var a = [];
var i = 0;
a[0] = " <p>here is paragraph " + i + "</p>";
a[++i] = " <p>here is paragraph " + i + "</p>";
a[++i] = " <p>here is paragraph " + i + "</p>";
a[++i] = " <table border='1' cellpadding='5' cellspacing='10'>";
a[++i] = " <tr>";
a[++i] = " <td>This is a cell</td>";
a[++i] = " <td>another cell</td>";
a[++i] = " </tr>";
a[++i] = " <tr>";
a[++i] = " <td>This is a cell</td>";
a[++i] = " <td>another cell</td>";
a[++i] = " </tr>";
a[++i] = " <tr>";
a[++i] = " <td colspan='2' align='center'>";
a[++i] = " <form name='fred' action=''>";
a[++i] = " <input type='text' name='aTxt' width='50'>";
a[++i] = " <input type='button' value='click me'"
+ "
onclick=\"alert(this.form.aTxt.value);\"><br>";
a[++i] = " <input type='reset' value='Reset'>";
a[++i] = " </form>";
a[++i] = " </td>";
a[++i] = " </tr>";
a[++i] = "</table>";

var s = a.join("");

document.write(s);

</script>
</body>
</html>
Click to expand...
Click to expand...
 
R

RobG

datactrl said:
Thank's Rob. My question is that I would like to popup a web page from an
already displayed page. And the popup page would like to be created from the
already displayed page with javascript. I think the way using
document.write() will change the content of already displayed page. That is
not the question.
Click to expand...
[snip]

If you want the content in a new window, then create a new window called
(say) newWindow and write to it:

newWindow = window.open('','Window Title','parameters....');

...

slabs of HTML

...

newWindow.document.write(s);



Then the HTML appears in newWindow, not the current one.


Cheers, Rob.
 
L

Lee

RobG said:
Thank's Rob. My question is that I would like to popup a web page from an
already displayed page. And the popup page would like to be created from the
already displayed page with javascript. I think the way using
document.write() will change the content of already displayed page. That is
not the question.
Click to expand...
[snip]

If you want the content in a new window, then create a new window called
(say) newWindow and write to it:

newWindow = window.open('','Window Title','parameters....');

...

slabs of HTML

...

newWindow.document.write(s);



Then the HTML appears in newWindow, not the current one.
Click to expand...

Sometimes. But sometimes you get an error because newWindow.document
has no properties, because the O/S hasn't opened the new window fast
enough, so you're trying to write into a window that isn't ready.

globalHTML=s;
window.open("javascript:eek:pener.globalHTML");

is more reliable.
 
D

datactrl

Now I do as following:
<html>
<head>
<title>pop up a window on fly</title>
<script type="text/javascript">
//function PopUpWindow(){
var sHtm = ["<html>",
"<head>",
"<title>popup htm</title>",
"</head>",
"<body>",
"<h1>Hello World</h1>",
"</body>",
"</html>"].join("");
// var s1 =
"dialogHeight=160px;dialogWidth=300px;help=no;status=no;resizeable=no";
// window.showModelessDialog("javascript:eek:pener.sHtm","",s1);
window.open("javascript:eek:pener.sHtm");
//}
</script>
</head>
<body>
<p>This is the calling window</P>
<button onClick="PopUpWindow()">popup</button>
</body>
</html>

This one works. But if I use button click to run PopUupWindow() or use
showModelessDialog() it won't work at all.

Jack
 
L

Lee

datactrl said:
Now I do as following:
<html>
<head>
<title>pop up a window on fly</title>
<script type="text/javascript">
//function PopUpWindow(){
var sHtm = ["<html>",
"<head>",
"<title>popup htm</title>",
"</head>",
"<body>",
"<h1>Hello World</h1>",
"</body>",
"</html>"].join("");
// var s1 =
"dialogHeight=160px;dialogWidth=300px;help=no;status=no;resizeable=no";
// window.showModelessDialog("javascript:eek:pener.sHtm","",s1);
window.open("javascript:eek:pener.sHtm");
//}
</script>
</head>
<body>
<p>This is the calling window</P>
<button onClick="PopUpWindow()">popup</button>
</body>
</html>

This one works. But if I use button click to run PopUupWindow() or use
showModelessDialog() it won't work at all.
Click to expand...

Because you've made sHtm *local* to the function PopUpWindow().
In order to work, it must be a *global* variable.
Get rid of the "var" keyword.
 
D

datactrl

Because you've made sHtm *local* to the function PopUpWindow().
In order to work, it must be a *global* variable.
Get rid of the "var" keyword.
Click to expand...


Thanks a lot Lee. Once sHtm is made as global it works. By the way, how
about using ShowModalDialog() or showModelessDialog(). It always showed
"error: opener.sHtm is null or not an object".

Jack
 
R

RobG

datactrl wrote:
[snip]
Thanks a lot Lee. Once sHtm is made as global it works. By the way, how
about using ShowModalDialog() or showModelessDialog(). It always showed
"error: opener.sHtm is null or not an object".
Click to expand...
[snip]

Those are IE only functions and are therefore shunned by
anyone wishing to create platform independent code - which,
after all, was the point of the internet and WWW in the
first place.

Cheers, Rob.
 
R

RobG

Dr John Stockton wrote:

[snip]
If you use i++ rather than ++i, then the first line can have the same
LHS as the rest, and the first para will be paragraph 1 - ISTM.

How about
var s = [
" <p>here is paragraph " + 1 + "</p>",
" <p>here is paragraph 2 </p>",
" <p>here is paragraph 3 </p>",
...
"" ].join("") ;

taking the view that self-numbering paragraphs are probably not needed?
Click to expand...

Looks great. I auto-numbered the paras just for the sake of
it, no real purpose.

Rob.
 
D

datactrl

Sometimes. But sometimes you get an error because newWindow.document
has no properties, because the O/S hasn't opened the new window fast
enough, so you're trying to write into a window that isn't ready.

globalHTML=s;
window.open("javascript:eek:pener.globalHTML");

is more reliable.
Click to expand...

This works fine. But sometimes it will open a blank window without any
content. Is there any way to work arround this problem? Thanks in advance!

Jack
 

Ask a Question

Want to reply to this thread or ask your own question?

You'll need to choose a username for the site, which only take a couple of moments. After that, you can post your question and our members will help you out.

Ask a Question

Similar Threads

Help with Javascript on my wordpress page 1
Is it possible to filter a hierarchy of web pages with a javascript questionnaire? 0
Displaying one page above another 6
I want to have a button in a web page with action for open new phone contact page and fill it with some date 1
How do I create a simple drop menu for/on a mobile app? 1
Web development on 2022 0
New coder with a focus on animating web banners 0
Key Factors in JavaScript Testing from a QA Engineer's Perspective 0

Members online

No members online now.
Total: 541 (members: 1, guests: 540)
Robots: 522

Forum statistics

Threads
474,431
Messages
2,571,679
Members
48,796
Latest member
Greg L.

Latest Threads

Top