-
Notifications
You must be signed in to change notification settings - Fork 1
/
Copy pathjson-Muliple inheritance.html
82 lines (61 loc) · 2.34 KB
/
json-Muliple inheritance.html
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
<!DOCTYPE html>
<html lang="en">
<title></title>
<head>
<script>
var menu={
"content main":"content",
"subber":{"content1":"sub1","content2":"sub2","content3":"sub3"},
"subber1":{"content1":"sub1","content2":"sub2","content3":"sub3"}
};
var menu2={
"content":"content of our main intro",
"subber":"jaswanth",
"sub1":"sub1 content",
"sub2":"sub2 content",
"sub3":"sub3 content",
"content main1":"content1",
"subber1":"jaswanth2"
};
var menuObj=Object.keys(menu);
console.log(menuObj[1]);
var str="";
str+="<ul>";
for(var jan in menuObj){
console.log(jan+"jan");
var temp=menu[menuObj[jan]];
console.log(menuObj[jan]+"menu"+temp);
if( typeof temp==="object"){
console.log(temp+"temp");
str+="<li id='"+menuObj[jan]+"' class='red' onclick='myFunction(this)'>"+menuObj[jan]+"</li>";
str+="<ul>";
for(var i of Object.keys(temp)){
console.log(i +"i");
str+="<li id='"+menu[menuObj[jan]][i]+"' class='red' onclick='myFunction(this)'>"+i+"</li>";
}
str+="</ul>";
} else{
str+="<li id='"+menu[menuObj[jan]]+"' class='red' onclick='myFunction(this)'>"+menuObj[jan]+"</li>";
}
}
str+="</ul>";
// console.log(str);
function func(){
document.getElementById('appenderId').innerHTML = str;
}
function myFunction(elem){
var idVal = elem.id;
document.getElementById("content_area").innerHTML=menu2[idVal];
}
</script>
<style>
ul{ list-style-type: none;}
</style>
</head>
<body onload="func()">
<div id="appenderId" style="border:solid 1px green;top:0px;left:0px;float:left;">
ddsfsdg
</div>
<div id="content_area" style="width:150px;height:500px;border:solid 1px red;border:solid 1px red;float:left"></div>
</body>
</html>