怎么让火狐浏览器兼容js

subaixue 2008-07-28 03:26:26

有哪位高手告诉我一下，怎么让火狐浏览器兼容js?
例如这段代码为什么在ie中起作用，而在火狐中没有反映？

<style type="text/css">

</style>
</head>
<body>
<script language=javascript>
function secBoard(n)
{
for(i=0;i <menu.childNodes.length;i++)
menu.childNodes[i].className="sec1";
menu.childNodes[n].className="sec2";
for(i=0;i <main.childNodes.length;i++)
main.childNodes[i].style.display="none";
main.childNodes[n].style.display="block";
}
</script>
<div id="header">
<ul id="menu">
<li onMouseOver="secBoard(0)" class="sec2">最新新闻 </li>
<li onMouseOver="secBoard(1)" class="sec1">最新文章 </li>
<li onMouseOver="secBoard(2)" class="sec1">最新日志 </li>
<li onMouseOver="secBoard(3)" class="sec1">论坛新帖 </li>
</ul>

<ul id="main">
<li class="block">第一个内容 </li>
<li class="unblock">第二个内容 </li>
<li class="unblock">第三个内容 </li>
<li class="unblock">第四个内容 </li>
</ul>

</div>
</body>
</html>

...全文

401 5 打赏收藏转发到动态举报

写回复

用AI写文章

5 条回复

切换为时间正序

请发表友善的回复…

发表回复

xiao1zhao 2008-08-03

打赏
举报

继续修改，压缩代码，哈哈，犹如食鸡肋啊...
汗一个先，^_^!`



<script language=javascript> 

function Sliding(id,e){//这里调换了e和id的位置

	e=e||window.event.srcElement;

...

}

</script> 

...

    <li onMouseOver="secBoard(0)" class="sec2">最新新闻</li> 这里省去了this

...

</div>

xiao1zhao 2008-08-03

打赏
举报

呵呵，看看我的方法。

修改后的



<script language=javascript> 

function secBoard(e,id){

	var m = document.getElementById(e.parentNode.id).getElementsByTagName("li");

	var t = document.getElementById(e.parentNode.getAttribute("content")).getElementsByTagName("li");

	for(var n = 0; n < m.length; n++){

		m[n].className = "sec1";

		t[n].style.display="none";

	}

		e.className = "sec2";

		t[id].style.display="block";

}

</script> 

<div id="header"> 

<ul id="menu" content="main">

	<li onMouseOver="secBoard(this,0)" class="sec2">最新新闻</li> 

	<li onMouseOver="secBoard(this,1)" class="sec1">最新文章 </li> 

	<li onMouseOver="secBoard(this,2)" class="sec1">最新日志 </li> 

	<li onMouseOver="secBoard(this,3)" class="sec1">论坛新帖 </li> 

</ul> 

<!--内容显示区域--> 

<ul id="main">

	<li class="block">第一个内容 </li> 

	<li class="unblock">第二个内容 </li> 

	<li class="unblock">第三个内容 </li> 

	<li class="unblock">第四个内容 </li> 

</ul> 

<!--内容显示区域--> 

</div>

xiao1zhao 2008-08-03

打赏
举报

又见孟子老大了
孟子老大好！

孟子E章 2008-07-28

打赏
举报

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

<html xmlns="http://www.w3.org/1999/xhtml">

<head>

<style type="text/css">

<!--

#header {

background-color: #F8F4EF;

height: 200px;

width: 400px;

margin: 0px;

padding: 0px;

border: 1px solid #ECE1D5;

font-family: "宋体";

font-size: 12px;

}

#menu {

margin: 0px;

padding: 0px;

list-style-type: none;

}

#menu li {

display: block;

width: 100px;

text-align: center;

float: left;

margin: 0px;

padding-top: 0.2em;

padding-right: 0px;

padding-bottom: 0.2em;

padding-left: 0px;

cursor: hand;

}

.sec1 { background-color: #FFFFCC;}

.sec2 { background-color: #00CCFF;}

.block { display: block;}

.unblock { display: none;}

-->

</style>

</head>

<body>

<script language=javascript>

function secBoard(n)

{

for(i=0;i <document.getElementById("menu").getElementsByTagName("li").length;i++)

document.getElementById("menu").getElementsByTagName("li")[i].className="sec1";

document.getElementById("menu").getElementsByTagName("li")[n].className="sec2";

for(i=0;i <document.getElementById("main").getElementsByTagName("li").length;i++)

document.getElementById("main").getElementsByTagName("li")[i].style.display="none";

document.getElementById("main").getElementsByTagName("li")[n].style.display="block";

}

</script>

<div id="header">

<ul id="menu">

<li onMouseOver="secBoard(0)" class="sec2">最新新闻 </li>

<li onMouseOver="secBoard(1)" class="sec1">最新文章 </li>

<li onMouseOver="secBoard(2)" class="sec1">最新日志 </li>

<li onMouseOver="secBoard(3)" class="sec1">论坛新帖 </li>

</ul>

<!--内容显示区域-->

<ul id="main">

<li class="block">第一个内容 </li>

<li class="unblock">第二个内容 </li>

<li class="unblock">第三个内容 </li>

<li class="unblock">第四个内容 </li>

</ul>

<!--内容显示区域-->

</div>

</body>

</html>