如何強制將元素設為另一個div的父元素

Question

我來解決三個問題。 我知道，javascript可以修復它。 但是，我不太了解JavaScript。 所以，我需要你的幫助。

（1）我必須強制使“ div C”的元素“ class dropdown”的父div。 例如，這是結構：

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

我知道，一兩行javascript代碼可以做到這一點。 但是，我不知道代碼。 那么，使li.dropdown成為“ div C”的父級的javascript代碼是什么？

（2）如何通過onclick選項關閉div？ 像結構：

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

默認情況下， display: none main-nav display: none當任何人單擊折疊鏈接時，main-nav div將打開。 當人們再次單擊折疊鏈接時，main-nav將再次關閉。 我可以用javascript打開main-nav。 但是，我無法關閉它。 我已經嘗試過這種方式：

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';
    }
}

我認為問題出在下面。 請幫我修復它。

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

（3）如何通過javascript更改背景。 像div這樣定義：

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

當人們對此叮當響時，我想更改背景圖像。 我在下面嘗試過。 但是，它不起作用:(

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';
    }
}

可能是這條線上的問題：

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

Answer 1

這些問題完全無關，我相信您應該將它們作為單獨的問題發布。 無論如何，這是我的答案：

（1）-假設每個類別只有一個元素

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)';