0

私は3つの問題のために来ました。私は知っています、javascriptはそれを修正できます。しかし、私はJavaScriptがよくわかりません。だから、私はあなたの助けが必要です。

(1)要素「class dropdown」を強制的に「div C」の親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>

私は、1行または2行のjavascriptコードでそれを実現していることを知っています。しかし、私はコードを知りません。では、"div C" の親に li.dropdown を作成するための JavaScript コードは何ですか?

(2) onclick オプションで div を閉じるには? 構造のように：

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

デフォルトでは、main-nav はdisplay: none、誰かが折りたたみリンクをクリックすると、main-nav div が開きます。折りたたみリンクをもう一度クリックすると、メイン ナビゲーションが再び閉じます。javascriptでメインナビを開くことができます。でも、閉まらない。私はこの方法で試しました：

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

1 に答える 1

0

これらの質問はまったく無関係です。別の質問として投稿する必要があったと思います。とにかく、ここに私の答えがあります：

(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)';
于 2013-08-23T16:26:52.937 に答える