すべてのリンクを検索してリストを作成する

Question

すべてのリンク（アンカーなし）を見つけて、jQueryで表示される順にリスト内に配置するにはどうすればいいですか？例えば

：

Loremのイプサムdolorは、AMET consectetur adipiscingのELIT座ります。 Donec ____um ut justo fermentum hendrerit ultriciesに座ってください。

だから、これはなる：

Loremのイプサム

• dolor

は

• 、AMET座ります

アジパスエリート。

• Donec

イプサムUTフストファーメンタム hendrerit ultriciesをAMET座ります。

私は基本的に私のサイトにembed.lyを使用していますので、ユーザーがフォームに記入すると、youtube/flickrのリンクが自動的に表示されます。私が問題になっている問題は、YouTube動画のサムネイルが大きすぎるように見えて正しく切り替えられないことです（つまり、ユーザーが動画のサムネイルをクリックして表示するようにしたい）。 （たとえば、ユーザーがdolarリンクをクリックした場合、embed.lyサンプルのようにYouTubeビデオがその下に表示されます）。

私はphpのマークダウンでサーバー側でphpを使用しています。

embedlyのクエリのコードは以下の通りです：ビデオのリンクを追加したとき、私のサイトを作る

<script type="text/javascript"> 

$(document).ready(function() { 
    $("a").embedly({}, function(oembed, dict){ 
    if (oembed == null) 
     alert("no embedly content found");  
    var output = "<a class='embedly' href='#'><img src='"+oembed.thumbnail_url+"' /></a><span>"+oembed.title+"</span>"; 
    output += oembed['code']; 
    $(dict["node"]).parent().html(output); 
    }); 
    var anchors = $("a"); anchors.embedly(); anchors.filter("[href*=flx.me]").addClass("googlenl"); 
    $('a.embedly').live("click", function(e){ 
    e.preventDefault(); 
    $(this).parents('li').find('.embed').toggle(); 
    }); 
}); 
</script> 

HTMLは次のとおりです。細長い質問の

> <div id="content"> 
>  <div class="youtube"> 
>    <p><a class="embedly" href="#"><img 
> src="phpForum_files/hqdefault.jpg"></a><span>&#65333;&#65317;&#65318;&#65313;Chanpions 
> League 2005-2006 RealMadrid vs Arsenal 
> 2ndleg</span><div 
> class="embed"><object height="360" 
> width="640"><param name="wmode" 
> value="opaque"><param name="movie" 
> value="http://www.youtube.com/v/7aPGa9Gqj2c?fs=1"><param 
> name="allowFullScreen" 
> value="true"><param 
> name="allowscriptaccess" 
> value="always"><embed 
> src="phpForum_files/7aPGa9Gqj2c.swf" 
> type="application/x-shockwave-flash" 
> allowscriptaccess="always" 
> allowfullscreen="true" wmode="opaque" 
> height="360" 
> width="640"></object></div></p> 
>  </div> </div> 

は申し訳ありません。乾杯。

Answer 1

$("#container").find("a").wrap("<li />").wrap("<ul />"); 

デモ：http://jsfiddle.net/karim79/RmCGh/

Answer 2

あなたはおそらくそこから

$('a').not('[href^="#"]') 

のようなものを使用して、すべての非アンカーリンクを見つける（ "未テスト" 読み）ことができ、あなたが<ul><li>...</li></ul>の要素をwrapことができブロック。

リンクをインプレースで置き換える場合は、リストがそこに属していないため、周囲の段落（段落を使用する場合）を閉じる必要があります。

Answer 3

var links = document.anchors; 

または

var links = element.getElementsByTagName('a'); 

Answer 4

<p> 
    Lorem ipsum <a href="http://www.link1.com" rel="nofollow">dolor</a> sit amet, <a href="http://www.link2.com" rel="nofollow">consectetur</a> adipiscing elit. <a href="http://www.link3.com" rel="nofollow">Donec</a> sit amet ipsum ut justo fermentum hendrerit ultricies. 
    </p> 
<script type="text/javascript"> 
    $("p a").wrap("<ul><li></li></ul>"); 
</script>