HTML

Uses of the New Window Command for Web Sites

This article talks about opening new windows on a web page. There are a number of reasons why we might want to do this. So let's think about why we need to open a link in a new window.

Author Info:

By: Stephen Davies

Poor Best

Rating:

/ 2

February 26, 2008

TABLE OF CONTENTS:

The above examples all require an existing URL. But what if we just want to give the user a simple message? Do we need to create a new HTML file? It seems a little stupid to do such things, right? Okay, let's go ahead with a simple demonstration. When users click a link, it will open a new window with the current date/time displayed.

<html>

<head>

<title>Uses of the New Window command demonstration 2</title>

<script type="text/javascript">

function showDateWin() {

var date = new Date();

var win = window.open('', '_blank', 'width=400, height=100, menubar=no, toolbar=no,
location=no, scrollbars=no, status=no, resizable=no');

win.document.writeln('Current Date Time: ' + date.toUTCString());

}

</script>

</head>

<body>

<h1>window.open() demo2</h1>

<a href="#" onclick="showDateWin();">Show Date</a>

</body>

</html>

Picture 6: open a new window with dynamic content

In the showDateWin() function, we did not specify the URL in the window.open() method, so the browser will open a blank window. Though in the second statement, "win.document.writeln('Current Date Time: ' + date.toUTCString())", we dynamically write some content in the opened window. That's like magic, isn't it?

According to the above examples, we can see that using window.open() to open new windows is very easy and flexible. What's more, it can customize the new window feature. In this way, we can make it a specified size and hide the menu bar, toolbar, etc. to show a neat window.

Conclusion

With the latest XHTML specification, it is not recommended that you use the target attribute of <a> tag or <base> tag because it is not supported. The best way to open a new window is to use JavaScript, which is flexible and powerful. Keep in mind that this method requires the browser to support JavaScript; if the browser is very old or JavaScript is disabled, the links will not work. I think we don't need to worry about that though since modern browsers all support JavaScript and a lot of web 2.0 applications are based on JavaScript already, like Google's GMail.

DISCLAIMER: The content provided in this article is not warranted or guaranteed by Developer Shed, Inc. The content provided is intended for entertainment and/or educational purposes in order to introduce to the reader key ideas, concepts, and/or product reviews. As such it is incumbent upon the reader to employ real-world tactics for security and implementation of best practices. We are not liable for any negative consequences that may result from implementing any information covered in our articles or tutorials. If this is a hardware review, it is not recommended to open and/or modify your hardware.