你可以用 JavaScript 去得到和改变 CSS－P 元素中的性质.
但由于不
同的浏览器的元素和元素的性质名字有所不同, 我们应该知道如何
处理这种讨厌的情况。在这里,
我们将要探讨如何让你的程序在两
种主要的浏览器 NS4 和 IE4 中都工作
浏览器检测:
首先, 我们应该知道如何来知道用户用的是哪种浏览器. 下面这段程
序虽然比较简单但足以区别 NS4 和 IE4. ns4 = (document.layers)? true:false
ie4 = (document.all)? true:false
document.layers 是 Netscape 4 专有的， 而 document.all 却是 IE 4
专
有的. 所以检查这些专有 object 存在与否可以帮助我们设立变量 ns4
(为 Netscape 4.0) 和
ie4 (为 Internet Explorer 4.0). 如果 document.layers
存在, 就让
ns4 等于 ture. 如果document.all 存在， 就让 ie4 等于 true.
这样，以后你如果需要知道用户用的是那个浏览器， 检查这两个变
量就可以了
function check() {
if (ns4) {
// do something in Netscape Navigator 4.0
}
if (ie4) {
// do something in Internet Explorer 4.0
}
}
使用 JavaScript 和 CSS-P:
假如我们有一个如下的 DIV tag： <DIV ID="blockDiv" STYLE="position:absolute; left:200; top:100">
<IMG SRC="../photo/jie07.jpg" WIDTH=30 HEIGHT=30 BORDER=0>
</DIV>
DIV 的名字是随你起的. 但当你给了它名字以后, JavaScript 就要参
照这个名字来控制它. 下面告诉你 JavaScript
如何参照这个名字的.
对 Netscape 来说， 得到 CSS-P 性质 (property) 的方法如下: document.blockDiv.propertyName
或者是 document.layers["blockDiv"].propertyName
而对于 Internet Explore 来说， 要用 blockDiv.style.propertyName
或者是 document.all["blockDiv"].style.propertyName
propertyName 可以是任何一个 DIV 可以用的 CSS－P 的性质, 比
如 left, top,
visibility, zIndex, width。
浏览器通用方法 (指针变量):
一个比较好的使得你的程序通用于 Netscape 和 IE 的方法是设立一
个变量. 如果浏览器是 NS, 这个变量指向
document.blockDiv. 如果浏
览器是 IE. 它就指向 blockDiv.style
我们称它为指针变量。请看下面
的语句. if (ns4) block = document.blockDiv
if (ie4) block = blockDiv.style
你可以注意到, 有了这个指针变量, 我们以后可以用简便的方法得
到或改变 CSS-P 的性质. 因为无论你用的是那种浏览器,
对于这个
DIV, 我们都用 block 来表示. 比如你想看看一个名字为 "blockDiv"
的 Div tag
的横向左边坐标是多少, 可以 block.left
一个实例这个例子将能出示一个预警窗口告诉你一个 CSS－P 元素的 left,
top 和 visiibilty 性质。 这个程序在IE和NS都能工作。这套教程
的目的就是让你能了解如何写出通用的动态网页
<HTML>
<HEAD>
<SCRIPT LANGUAGE="JavaScript">
<!--
ns4 = (document.layers)? true:false
ie4 = (document.all)? true:false
function init() {
if (ns4) block = document.blockDiv
if (ie4) block = blockDiv.style
}
//-->
</SCRIPT>
</HEAD>
<BODY onLoad="init()">
<A HREF="javascript:alert(block.left)">left</A> -
<A HREF="javascript:alert(block.top)">top</A> -
<A HREF="javascript:alert(block.visibility)">visibility</A>
<DIV ID="blockDiv"
STYLE="position:absolute; left:50; top:100;
width:30; visibility:visible;">
<IMG SRC="block.gif" WIDTH=30 HEIGHT=30 BORDER=0>
</DIV>
</BODY>
| |
点这看这个实例如何工作
-
| 注意: init() 子 程 序 是 在 BODY onLoad="..." 叫
的。 这 样 它 只 能 在 网 页 所 有 的 内 容 全 部 下 传 以 后 才 被 执 行. 要 不 然 会 因 为 在 有
blockDiv 之 前 而 用 它 而 造 成 网 页 错 误.
| |