2016-09-27 10 views
0

各ul要素の2つのリスト項目の間にリンクを挿入したいとします。現時点では、私のコードはリンクを最後のul要素に挿入するだけです。あなたはただ1つのアンカーを作成し、それが終わるので、それを動かすためのjQuery各リスト要素にリンクタグを挿入する

$('.list').append(function() { 
    return $('<a>', { href : '/', text : 'UP' }) 
}); 

あなたのコードが動作しない理由で、あることを行うにはもっと簡単な方法があります

<html> 
<div class="list"> 
    <ul> 
     <li>what</li> 
     <li>now</li> 
    </ul> 
</div> 
<div class="list"> 
    <ul> 
     <li>what</li> 
     <li>now</li> 
    </ul> 
</div> 

<script src="https://code.jquery.com/jquery-1.10.2.js"></script> 
<script> 
    var tag = document.createElement("A") 
    var linkedTag = tag.setAttribute('href', '/'); 
    tag.innerHTML = "UP" 

    $('.list').each(function(i, obj) { 
    var one = obj.childNodes[1]; 
    one.insertBefore(tag, one.childNodes[2]) 
    }); 
</script> 
</html> 
+0

各挿入のための1つを作成する必要が...そうでなければ、単に '私はそれぞれのUL element.'に2つのリスト項目の間のリンクを挿入したい – charlietfl

+0

周りに同じものを移動している - との間でしかしul要素では? –

答えて

2

最後の場所でそれはに移動されました。

アンカーをULに直接挿入することは、無効なマークアップです。あなたは、各ULの前にアンカーを配置したい場合は、

$('.list ul').prepend(function() { 
    return $('<a>', { href : '/', text : 'UP' }) 
}); 

にしてくださいあなたは2つの既存のLI要素中間にアンカーをしたい場合は、あなたにもLI要素にそのアンカーをラップする必要があると思います

$('.list ul li:first-child').after(function() { 
    return $('<li>', { 
     html : $('<a>', { href : '/', text : 'UP' }) 
    }); 
}); 

FIDDLE

関連する問題