Trovare tutti i link e fare un elenco

Question

come si possono trovare tutti i link (non ancore) e inserirli in una lista, nell'ordine in cui appaiono, in jQuery.

Ad esempio:

  

sit amet, rel consectetur adipiscing elit . Donec sit amet ipsum ut justo fermentum hendrerit ultricies.

Quindi, questo sarebbe diventato:

  

Lorem ipsum

     

  
• dolor
  

     

sit amet,

     

  
• consectetur
  

     

elit adipiscing.

     

  
• Donec
  

     

sit amet ipsum ut justo fermentum   ultricies hendrerit.

In sostanza sto usando embed.ly per il mio sito, in modo che quando un utente compila un modulo, i link youtube / flickr appaiono automaticamente dove li creò. Il problema che sto avendo è che la miniatura del video di YouTube sembra essere troppo grande, e non passa correttamente (vale a dire che voglio che l'utente clicca sulla miniatura per il video di presentarsi). (Così, per esempio, se l'utente fa clic sul collegamento Dolar, il video di YouTube dovrebbe comparire sotto di essa, come fa nei campioni embed.ly).

Sto usando PHP sul lato server con PHP Markdown.

Il codice di query per embedly è qui sotto:

<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>

Il mio sito html fa quando un aggiunge un collegamento video è:

>    <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>

Ci scusiamo per la questione di forma allungata. Cin cin.

Answer 1

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

Demo: http://jsfiddle.net/karim79/RmCGh/

Answer 2

Si potrebbe (leggi "non testato") trovare tutti i collegamenti non-ancoraggio che utilizzano qualcosa come

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

Da lì, si potrebbe involucro l'elemento in un blocco <ul><li>...</li></ul>.

Tieni presente che, se hai intenzione di sostituire i collegamenti sul posto, potrebbe essere necessario chiudere il paragrafo che circonda (se si utilizza un paragrafo) come liste non appartengono al casinò.

Answer 3

var links = document.anchors;

o

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>