Trouver tous les liens et faire une liste

Question

comment pouvez-vous trouver tous les liens (pas ancres) et placez-les à l'intérieur d'une liste, dans l'ordre d'apparition, dans jQuery.

Par exemple:

  

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

Alors, cela deviendrait:

  

Lorem ipsum

     

  
• dolor
  

     

sit amet,

     

  
• consectetur
  

     

adipiscing elit.

     

  
• Donec
  

     

sit amet ipsum ut justo fermentum   ultricies de hendrerit.

En fait j'utilise embed.ly pour mon site, donc quand un remplissages d'utilisateur dans un formulaire, les liens youtube / flickr apparaissent automatiquement où il les a créés. Le problème que je vais avoir est que la vignette pour la vidéo youtube semble être trop grand, et ne bascule correctement (à savoir, je veux que l'utilisateur de cliquer sur la vignette pour la vidéo apparaisse). (Ainsi, par exemple, si l'utilisateur clique sur le lien dolar, la vidéo youtube devrait apparaître en dessous, comme il le fait dans les échantillons embed.ly).

J'utilise php sur le côté serveur avec PHP Markdown.

Le code de requête pour embedly est ci-dessous:

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

Le html mon site fait lorsqu'un ajoute un lien vidéo est:

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

Désolé pour la question allongée. Vive.

Answer 1

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

Démo: http://jsfiddle.net/karim79/RmCGh/

Answer 2

Vous pourriez peut-être (lire « non testé ») trouver tous les liens non-ancrage à l'aide de quelque chose comme

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

A partir de là, vous pourriez enveloppe l'élément dans un bloc de <ul><li>...</li></ul>.

Gardez à l'esprit que si vous êtes désireux de remplacer les liens en place, vous devrez peut-être fermer le paragraphe environnant (si vous utilisez un paragraphe) que les listes ne appartiennent pas là.

Answer 3

var links = document.anchors;

ou

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>