能不能把一个网面中两个不同ID的内容放到一个JS文件中进行输出？

mondi 2010-11-01 08:15:03

我想把这样一个页面中的 aa 和 bb 两个 ID 写入到一个JS文件中，因为很多页面要到这两个ID，好像是用一个
document.getElementById 和innerHTML，还是用document.writeln
不知哪位朋友能帮忙给写一下，下面是一个小样式

<!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>

<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />

<title>无标题文档</title>

</head>



<body>

<div id="aa">

<ul>

<li>123456</li>

<li>456789</li>

<li>789123</li>

</ul>

</div>



...





<div id="bb">

<ul>

<li>abcdef</li>

<li>ghijklm</li>

<li>nopqrst</li>

</ul>

</div>

</body>

</html>

我现在的方法只会用两个文件来做,再从页面中分别调用，但是不知为什么这方法还会和其它的一些JS发生冲突。因为我不会用JS，一定有更好更简单的方法。请指教。多谢了。
AA.JS

document.writeln("<div id=\"aa\">");

document.writeln("<ul>");

document.writeln("<li>123456<\/li>");

document.writeln("<li>456789<\/li>");

document.writeln("<li>789123<\/li>");

document.writeln("<\/ul>");

document.writeln("<\/div>")

BB.JS

document.writeln("<div id=\"bb\">");

document.writeln("<ul>");

document.writeln("<li>abcdef<\/li>");

document.writeln("<li>ghijklm<\/li>");

document.writeln("<li>nopqrst<\/li>");

document.writeln("<\/ul>");

document.writeln("<\/div>")

<!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>

<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />

<title>无标题文档</title>

</head>



<body>

<div id="aa">

<script type="text/javascript" src="../Scripts/AA.js"></script>

</div>



...





<div id="bb">

<script type="text/javascript" src="../Scripts/BB.js"></script>

</div>

</body>

</html>

...全文

151 8 打赏收藏转发到动态举报

写回复

用AI写文章

8 条回复

切换为时间正序

请发表友善的回复…

发表回复

mondi 2010-11-01

打赏
举报

这是菜单的代码

var menu=function(){

	var t=15,z=50,s=6,a;

	function dd(n){this.n=n; this.h=[]; this.c=[]}

	dd.prototype.init=function(p,c){

		a=c; var w=document.getElementById(p), s=w.getElementsByTagName('ul'), l=s.length, i=0;

		for(i;i<l;i++){

			var h=s[i].parentNode; this.h[i]=h; this.c[i]=s[i];

			h.onmouseover=new Function(this.n+'.st('+i+',true)');

			h.onmouseout=new Function(this.n+'.st('+i+')');

		}

	}

	dd.prototype.st=function(x,f){

		var c=this.c[x], h=this.h[x], p=h.getElementsByTagName('a')[0];

		clearInterval(c.t); c.style.overflow='hidden';

		if(f){

			p.className+=' '+a;

			if(!c.mh){c.style.display='block'; c.style.height=''; c.mh=c.offsetHeight; c.style.height=0}

			if(c.mh==c.offsetHeight){c.style.overflow='visible'}

			else{c.style.zIndex=z; z++; c.t=setInterval(function(){sl(c,1)},t)}

		}else{p.className=p.className.replace(a,''); c.t=setInterval(function(){sl(c,-1)},t)}

	}

	function sl(c,f){

		var h=c.offsetHeight;

		if((h<=0&&f!=1)||(h>=c.mh&&f==1)){

			if(f==1){c.style.filter=''; c.style.opacity=1; c.style.overflow='visible'}

			clearInterval(c.t); return

		}

		var d=(f==1)?Math.ceil((c.mh-h)/s):Math.ceil(h/s), o=h/c.mh;

		c.style.opacity=o; c.style.filter='alpha(opacity='+(o*100)+')';

		c.style.height=h+(d*f)+'px'

	}

	return{dd:dd}

}();

mondi 2010-11-01

打赏
举报

笨了点，不知道举一反三，会了会了，加个\就可以了.

不过,不知为什么,出现冲突了,可能是和我的菜单的JS文件,一点菜单就会提示找不到文件.救我.

mondi 2010-11-01

打赏
举报

最后一个问题，也是真巧，我把第一个单引号一改，好家伙。在后面的语句中正好有一个Mary's,结果后面所有的都无法生效了。

weizuqing 2010-11-01

打赏
举报

提示什么错误
document.getElementById('aa').innerHTML ="（这里要用单引号，因为你在字符串里面有用到双引号例如"menu"等等）<ul class="menu" id="menu">
<li><a href="../chine/index.html" class="menulink">Chine</a>
<ul>
<li><a href="../chine/generalite.html">Généralité</a></li>
<li><a href="../chine/geographie.html">Géographie</a></li>
<li><a href="../chine/histoire.html">Histoire</a></li>
<li><a href="../chine/fetes_traditonnelles_chinoise/index.html">Fêtes traditonnelles</a></li>
<li><a href="../chine/ethnies.html">Ethnies</a></li>
<li><a href="../media_chinois/TV_en_direct/cctvfr.html">TV en français</a></li>
......
而且同一个字符串不能换行的，不过js里面有提供一种方法在行尾加\，例如
document.getElementById('aa').innerHTML ="<ul class="menu" id="menu">\(这里加)
<li><a href="../chine/index.html" class="menulink">Chine</a>

mondi 2010-11-01

打赏
举报

楼上朋友，十分感谢。可为什么提示我语法有错误呢？

document.getElementById('aa').innerHTML ="<ul class="menu" id="menu">

      <li><a href="../chine/index.html" class="menulink">Chine</a>

        <ul>

          <li><a href="../chine/generalite.html">Généralité</a></li>

          <li><a href="../chine/geographie.html">Géographie</a></li>

          <li><a href="../chine/histoire.html">Histoire</a></li>

          <li><a href="../chine/fetes_traditonnelles_chinoise/index.html">Fêtes traditonnelles</a></li>

          <li><a href="../chine/ethnies.html">Ethnies</a></li>

          <li><a href="../media_chinois/TV_en_direct/cctvfr.html">TV en français</a></li>

......

weizuqing 2010-11-01

打赏
举报

document.getElementById('aa').innerHTML = "<ul><li>abcdef</li><li>ghijklm</li><li>ghijklm</li></ul>"
同理bb
document.getElementById('bb').innerHTML = "<ul><li>abcdef</li><li>ghijklm</li><li>ghijklm</li></ul>"

当然如果li中的数据是变量，你只要字符串拼接一下就好，不过用这种方法速度会慢一点，还有一种方法就是通过数组：
var arr = [];
arr.push("<ul><li>");
arr.push(value1); //这里我就写一项，其余同理，多的话你就可以用for
arr.push("</li></ul>")

document.getElementById('aa').innerHTML = arr join("");