document.getElementById(innerstr).innerHTML='hello'+id;
}
for(var i=1;i <4;i++){
span=document.createElement("span");
span.id="FT"+i;
span.onclick = function(){
hidden(this.id,'ST'+i);
};我想要点击时调用hello()方法;
span.innerHTML='hello';
span.style.background="yellow";
document.getElementById('T'+i).appendChild(span);
}
HTML部分是
<div id="T1"> </div>
<div id="T2"> </div>
<div id="T3"> </div>
就是达到这个效果:
<div id="T1"> <span onclick="hello('FT1')" id="FT1">hello </span>
<div id="ST1"> hello T1</div></div>
<div id="T2"> <span onclick="hello('FT2')" id="FT2">hello </span>
<div id="ST1"> hello T2</div></div>
<div id="T3"> <span onclick="hello('FT3')" id="FT3">hello </span>
<div id="ST1"> hello T3</div></div>
3 个解决方案
#1
#2
<html>
<body>
HTML部分是
<div id="T1"> </div>
<div id="T2"> </div>
<div id="T3"> </div>
<script>
function hello(innerstr,divid){
document.getElementById(innerstr).innerHTML='hello'+divid;
}
for(var i=1;i <4;i++){
(function(i){
span=document.createElement("span");
span.id="FT"+i;
span.onclick = function(){
hello(this.id,'ST'+i);
};
span.innerHTML='hello';
span.style.background="yellow";
document.getElementById('T'+i).appendChild(span);
})(i);
}
</script>
</body>
</html>
#3
<body onload="treeload()">
<script language="javascript" type="text/javascript">
var tid=0;
var tname=1;
var url=2;
var type=3;
var fid=4;
function hidden(B){
var nodes=loadlist();
var T='F'+nodes[B][tid];
var types=nodes[B][type];
if(types.indexOf( "folder")>-1){
document.getElementById(B).innerHTML=document.getElementById(B).innerHTML=="-"?"+":"-";
document.getElementById(T).style.display=document.getElementById(T).style.display=="none"?"block":"none";
}
}
function loadlist() {
var nodes = new Array();
var index = 0;
nodes[0] = ["T1", "体育", "#", "folder", "T0"];
nodes[1] = ["T2", "篮球", "#", "folder", "T1"];
nodes[2] = ["T3", "足球", "#", "folder", "T1"];
nodes[3] = ["T14", "姚明", "#", "link", "T2"];
nodes[4] = ["T5", "动漫", "#", "folder", "T0"];
nodes[5] = ["T6", "天空之城", "#", "link", "T5"];
nodes[6] = ["T7", "游戏", "#", "folder", "T0"];
nodes[7] = ["T8", "网页游戏", "#", "folder", "T7"];
nodes[8] = ["T9", "单机游戏", "#", "folder", "T7"];
nodes[9] = ["T10", "热血三国", "#", "link", "T8"];
nodes[10] = ["T11", "恐龙快打", "#", "link", "T9"];
nodes[11] = ["T12", "拳皇", "#", "link", "T9"];
nodes[12] = ["T13", "大力水手", "#", "link", "T5"];
nodes[13] = ["T4", "星际2", "#", "link", "T9"];
nodes[14] = ["T15", "小贝", "#", "link", "T3"];
return nodes;
}
function treeload(){
var nodes=loadlist();
for(var i=0;i<nodes.length;i++){
var div=document.createElement("DIV");
var divid='W'+nodes[i][tid];
var fatherid='F'+nodes[i][fid];
var nodeid=nodes[i][tid];
div.id=divid;
div.style.background="yellow";
document.getElementById(fatherid).appendChild(div);
var span=document.createElement("span");
var spanid=i;
span.id=spanid;
span.onclick = function(){
hidden(this.id);
};
var ttt=nodes[i][type];
if(ttt.indexOf( "folder")>-1){
span.innerHTML='+';
}else{
span.innerHTML='>';
}
document.getElementById(divid).appendChild(span);
var a=document.createElement("a");
a.id='A'+nodes[i][tid];
a.href=nodes[i][url];
a.innerHTML=nodes[i][tname];
document.getElementById(divid).appendChild(a);
var divt=document.createElement("DIV");
divt.id='F'+nodes[i][tid];
divt.style.display="none";
divt.style.paddingLeft='20px';
document.getElementById(divid).appendChild(divt);
}
}
</script>
<div id="FT0"></div>
</BODY>
<script language="javascript" type="text/javascript">
var tid=0;
var tname=1;
var url=2;
var type=3;
var fid=4;
function hidden(B){
var nodes=loadlist();
var T='F'+nodes[B][tid];
var types=nodes[B][type];
if(types.indexOf( "folder")>-1){
document.getElementById(B).innerHTML=document.getElementById(B).innerHTML=="-"?"+":"-";
document.getElementById(T).style.display=document.getElementById(T).style.display=="none"?"block":"none";
}
}
function loadlist() {
var nodes = new Array();
var index = 0;
nodes[0] = ["T1", "体育", "#", "folder", "T0"];
nodes[1] = ["T2", "篮球", "#", "folder", "T1"];
nodes[2] = ["T3", "足球", "#", "folder", "T1"];
nodes[3] = ["T14", "姚明", "#", "link", "T2"];
nodes[4] = ["T5", "动漫", "#", "folder", "T0"];
nodes[5] = ["T6", "天空之城", "#", "link", "T5"];
nodes[6] = ["T7", "游戏", "#", "folder", "T0"];
nodes[7] = ["T8", "网页游戏", "#", "folder", "T7"];
nodes[8] = ["T9", "单机游戏", "#", "folder", "T7"];
nodes[9] = ["T10", "热血三国", "#", "link", "T8"];
nodes[10] = ["T11", "恐龙快打", "#", "link", "T9"];
nodes[11] = ["T12", "拳皇", "#", "link", "T9"];
nodes[12] = ["T13", "大力水手", "#", "link", "T5"];
nodes[13] = ["T4", "星际2", "#", "link", "T9"];
nodes[14] = ["T15", "小贝", "#", "link", "T3"];
return nodes;
}
function treeload(){
var nodes=loadlist();
for(var i=0;i<nodes.length;i++){
var div=document.createElement("DIV");
var divid='W'+nodes[i][tid];
var fatherid='F'+nodes[i][fid];
var nodeid=nodes[i][tid];
div.id=divid;
div.style.background="yellow";
document.getElementById(fatherid).appendChild(div);
var span=document.createElement("span");
var spanid=i;
span.id=spanid;
span.onclick = function(){
hidden(this.id);
};
var ttt=nodes[i][type];
if(ttt.indexOf( "folder")>-1){
span.innerHTML='+';
}else{
span.innerHTML='>';
}
document.getElementById(divid).appendChild(span);
var a=document.createElement("a");
a.id='A'+nodes[i][tid];
a.href=nodes[i][url];
a.innerHTML=nodes[i][tname];
document.getElementById(divid).appendChild(a);
var divt=document.createElement("DIV");
divt.id='F'+nodes[i][tid];
divt.style.display="none";
divt.style.paddingLeft='20px';
document.getElementById(divid).appendChild(divt);
}
}
</script>
<div id="FT0"></div>
</BODY>
#1
#2
<html>
<body>
HTML部分是
<div id="T1"> </div>
<div id="T2"> </div>
<div id="T3"> </div>
<script>
function hello(innerstr,divid){
document.getElementById(innerstr).innerHTML='hello'+divid;
}
for(var i=1;i <4;i++){
(function(i){
span=document.createElement("span");
span.id="FT"+i;
span.onclick = function(){
hello(this.id,'ST'+i);
};
span.innerHTML='hello';
span.style.background="yellow";
document.getElementById('T'+i).appendChild(span);
})(i);
}
</script>
</body>
</html>
#3
<body onload="treeload()">
<script language="javascript" type="text/javascript">
var tid=0;
var tname=1;
var url=2;
var type=3;
var fid=4;
function hidden(B){
var nodes=loadlist();
var T='F'+nodes[B][tid];
var types=nodes[B][type];
if(types.indexOf( "folder")>-1){
document.getElementById(B).innerHTML=document.getElementById(B).innerHTML=="-"?"+":"-";
document.getElementById(T).style.display=document.getElementById(T).style.display=="none"?"block":"none";
}
}
function loadlist() {
var nodes = new Array();
var index = 0;
nodes[0] = ["T1", "体育", "#", "folder", "T0"];
nodes[1] = ["T2", "篮球", "#", "folder", "T1"];
nodes[2] = ["T3", "足球", "#", "folder", "T1"];
nodes[3] = ["T14", "姚明", "#", "link", "T2"];
nodes[4] = ["T5", "动漫", "#", "folder", "T0"];
nodes[5] = ["T6", "天空之城", "#", "link", "T5"];
nodes[6] = ["T7", "游戏", "#", "folder", "T0"];
nodes[7] = ["T8", "网页游戏", "#", "folder", "T7"];
nodes[8] = ["T9", "单机游戏", "#", "folder", "T7"];
nodes[9] = ["T10", "热血三国", "#", "link", "T8"];
nodes[10] = ["T11", "恐龙快打", "#", "link", "T9"];
nodes[11] = ["T12", "拳皇", "#", "link", "T9"];
nodes[12] = ["T13", "大力水手", "#", "link", "T5"];
nodes[13] = ["T4", "星际2", "#", "link", "T9"];
nodes[14] = ["T15", "小贝", "#", "link", "T3"];
return nodes;
}
function treeload(){
var nodes=loadlist();
for(var i=0;i<nodes.length;i++){
var div=document.createElement("DIV");
var divid='W'+nodes[i][tid];
var fatherid='F'+nodes[i][fid];
var nodeid=nodes[i][tid];
div.id=divid;
div.style.background="yellow";
document.getElementById(fatherid).appendChild(div);
var span=document.createElement("span");
var spanid=i;
span.id=spanid;
span.onclick = function(){
hidden(this.id);
};
var ttt=nodes[i][type];
if(ttt.indexOf( "folder")>-1){
span.innerHTML='+';
}else{
span.innerHTML='>';
}
document.getElementById(divid).appendChild(span);
var a=document.createElement("a");
a.id='A'+nodes[i][tid];
a.href=nodes[i][url];
a.innerHTML=nodes[i][tname];
document.getElementById(divid).appendChild(a);
var divt=document.createElement("DIV");
divt.id='F'+nodes[i][tid];
divt.style.display="none";
divt.style.paddingLeft='20px';
document.getElementById(divid).appendChild(divt);
}
}
</script>
<div id="FT0"></div>
</BODY>
<script language="javascript" type="text/javascript">
var tid=0;
var tname=1;
var url=2;
var type=3;
var fid=4;
function hidden(B){
var nodes=loadlist();
var T='F'+nodes[B][tid];
var types=nodes[B][type];
if(types.indexOf( "folder")>-1){
document.getElementById(B).innerHTML=document.getElementById(B).innerHTML=="-"?"+":"-";
document.getElementById(T).style.display=document.getElementById(T).style.display=="none"?"block":"none";
}
}
function loadlist() {
var nodes = new Array();
var index = 0;
nodes[0] = ["T1", "体育", "#", "folder", "T0"];
nodes[1] = ["T2", "篮球", "#", "folder", "T1"];
nodes[2] = ["T3", "足球", "#", "folder", "T1"];
nodes[3] = ["T14", "姚明", "#", "link", "T2"];
nodes[4] = ["T5", "动漫", "#", "folder", "T0"];
nodes[5] = ["T6", "天空之城", "#", "link", "T5"];
nodes[6] = ["T7", "游戏", "#", "folder", "T0"];
nodes[7] = ["T8", "网页游戏", "#", "folder", "T7"];
nodes[8] = ["T9", "单机游戏", "#", "folder", "T7"];
nodes[9] = ["T10", "热血三国", "#", "link", "T8"];
nodes[10] = ["T11", "恐龙快打", "#", "link", "T9"];
nodes[11] = ["T12", "拳皇", "#", "link", "T9"];
nodes[12] = ["T13", "大力水手", "#", "link", "T5"];
nodes[13] = ["T4", "星际2", "#", "link", "T9"];
nodes[14] = ["T15", "小贝", "#", "link", "T3"];
return nodes;
}
function treeload(){
var nodes=loadlist();
for(var i=0;i<nodes.length;i++){
var div=document.createElement("DIV");
var divid='W'+nodes[i][tid];
var fatherid='F'+nodes[i][fid];
var nodeid=nodes[i][tid];
div.id=divid;
div.style.background="yellow";
document.getElementById(fatherid).appendChild(div);
var span=document.createElement("span");
var spanid=i;
span.id=spanid;
span.onclick = function(){
hidden(this.id);
};
var ttt=nodes[i][type];
if(ttt.indexOf( "folder")>-1){
span.innerHTML='+';
}else{
span.innerHTML='>';
}
document.getElementById(divid).appendChild(span);
var a=document.createElement("a");
a.id='A'+nodes[i][tid];
a.href=nodes[i][url];
a.innerHTML=nodes[i][tname];
document.getElementById(divid).appendChild(a);
var divt=document.createElement("DIV");
divt.id='F'+nodes[i][tid];
divt.style.display="none";
divt.style.paddingLeft='20px';
document.getElementById(divid).appendChild(divt);
}
}
</script>
<div id="FT0"></div>
</BODY>