0

javascript では、私の場合、div の特定の子をスパン タグとしてターゲットにするにはどうすればよいでしょうか。Aタグの子であるspanタグにCSSを追加したいと考えています。現在、ホバーされている A タグに回転を追加します。

function init(){
    document.getElementById("xmas-nav").onmouseover = function(e){
        if(e.target.tagName == "A"){
            e.target.style.WebkitTransform = "rotate(-15deg)";
        }
    }

}

window.addEventListener("load", init, true);


<nav>
    <ul class="xmas-nav" id="xmas-nav">
        <li><a href="#"><span class="xmas-home"></span>Home</a></li>
        <li><a href="#"><span class="xmas-countdown"></span>Countdown</a></li>
        <li><a href="#"><span class="xmas-competition"></span>Competition</a></li>
        <li><a href="#"><span class="xmas-crackers"></span>Crackers</a></li>
        <li><a href="#"><span class="xmas-ideas"></span>Xmas Ideas</a></li>
    </ul>
</nav>
4

3 に答える 3

2

変化する

e.target.style.WebkitTransform = "rotate(-15deg)";

に

e.target.getElementsByTagName("span")[0].style.WebkitTransform = "rotate(-15deg)";

一番下のコードでは、すべてのスパン要素を取得し、返された最初の要素を取得します (これが必要なスパン要素であると仮定します)。この span 要素で、スタイルを変更します。

于 2013-10-14T11:26:55.337 に答える
1

コードはアンカー タグに変換を適用します。アンカーの子である span タグに適用するように変更する必要があります。

function init(){
    document.getElementById("xmas-nav").onmouseover = function(e){
        if(e.target.tagName == "A"){
            var span;
            for (var i = 0; i < e.target.childNodes.length; i++) {
                span = e.target.childNodes[i];
                if (span.tagName === 'SPAN') {
                    span.style.WebkitTransform = "rotate(-15deg)";
                    break;
                }
            }
        }
    }
}
于 2013-10-14T11:18:00.710 に答える