Question

我遇到了3个问题。我知道，javascript可以修复它。但是，我不太了解javascript。所以，我需要你的帮助。

（1）我要强行制作元素“class dropdown”父div“div C”。例如，这是结构：

<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当有人点击折叠链接时，主导航div将会打开。当人们再次点击折叠链接时，主导航将再次关闭。我可以通过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)';

如何强有力地使另一个div的元素成为父元素

1 个答案: