javascript - How to make an element parent of another div forcefully -


i've come 3 problems. know, javascript can fix it. but, don't know javascript well. so, need help.

(1)i've make element "class dropdown" parent div of "div c" forcefully. example, structure:

<div class="a">   <ul>      <li class="dropdown"><a href="#">about</li>      <li><a href="#">about</li>      <li><a href="#">about</li>   </ul> </div> <div class="b"></div> <div class="c"></div> 

i know, 1 or 2 lines javascript code make that. but, don't know code. so, what's javascript code makeing li.dropdown parent of "div c"?

(2) how close div onclick option? structure:

<a href="#" class="collapse"></a> <div class="main-nav"></div> 

by default, main-nav display: none when, click on collapse link, main-nav div open. , when people click on collapse link again, main-nav close again. can open main-nav javascript. but, can't close it. i've tried way:

for(var a=0; a<document.getelementsbyclassname('collapse').length; a++){     document.getelementsbyclassname('collapse')[a].onclick = function(){         var mainnav = this.parentnode.parentnode.parentnode.parentnode.parentnode.parentnode.getelementsbyclassname('main-nav')[0]         if(mainnav.style.display = 'none')             mainnav.style.display = 'block';         else             mainnav.style.display = 'none';     } } 

i think @ below lines there problem. please, me fixing it.

if(mainnav.style.display = 'none')                 mainnav.style.display = 'block';             else                 mainnav.style.display = 'none'; 

(3) how can change background javascript. div defined this:

.main-nav li.dropdown {     background: url(../images/nav-arrow.png) 70% center no-repeat;   } 

i want change background image when people clink on that. i've tried way below. but, won't work :(

for(var a=0; a<document.getelementsbyclassname('dropdown').length; a++){     document.getelementsbyclassname('dropdown')[a].onclick = function(){         var innersubmenu = this.parentnode.parentnode.parentnode.parentnode.parentnode.parentnode.getelementsbyclassname('inner-submenu')[0]         dropdown.backgroundimage = 'url(../images/nav-arrow-hover.png)';         if(innersubmenu.style.display = 'none')             innersubmenu.style.display = 'block';         else             innersubmenu.style.display = 'none';     } } 

may be, problem on line:

dropdown.backgroundimage = 'url(../images/nav-arrow-hover.png)'; 

those questions totally unrelated, believe should have posted them separate questions. anyway, here answers:

(1) - assuming there single element of each class

document.queryselector('.c').appendchild(document.queryselector('.dropdown')); 

(2)

if(mainnav.style.display != 'block')         mainnav.style.display = 'block';     else         mainnav.style.display = 'none'; 

(3)

dropdown.style.backgroundimage = 'url(../images/nav-arrow-hover.png)'; 

Comments

Popular posts from this blog

java - Run a .jar on Heroku -

java - Jtable duplicate Rows -

validation - How to pass paramaters like unix into windows batch file -