jquery / javascript вставляет элементы ul / li в этот HTML - PullRequest
Новая
       2

jquery / javascript вставляет элементы ul / li в этот HTML

1 голос
/ 05 мая 2011

возможно ли изменить следующий HTML-код в источник, связанный в нижней части этой страницы?У меня ограниченный доступ сценариев к исходной странице, поэтому я ищу способ изменить страницу с помощью jquery или js.

Кроме того, идентификаторы отделов будут совершенно случайными, и будет различное количество ссылок относительнокаждой группе, поэтому она должна быть динамичной.Я пытался добавить, но у меня возникли проблемы с добавлением только начальных или закрывающих тегов, поэтому я не уверен, как это сделать.Заранее благодарен за любую помощь.

Дополнения, которые мне нужны в коде, помечены ** s

Первоначальный источник: 

<ul class="menu">
  <a id="group-car" href="#">Car</a>  
   <li><a id="department-2" href="link">Black</a></li>
   <li><a id="department-4" href="link">Blue</a></li>

  <a id="group-bike" href="#">Bike</a>  
   <li><a id="department-1" href="link">BMX</a></li>
   <li><a id="department-6" href="link">Racing</a></li>
   <li><a id="department-12" href="link">Mountain</a></li>             
</ul>

Что мне нужно в итоге: 

 <ul class="menu">
    **<li>**
        <a id="group-car" href="#">CAR</a>
        **<ul class="acitem">**  
            <li><a id="department-2" href="link">Black</a></li>
            <li><a id="department-4" href="link">Blue</a></li>
        **</ul>**
    **</li>**

    **<li>**
        <a id="group-bike" href="#">BIKE</a>
        **<ul class="acitem">**
            <li><a id="department-1" href="link">BMX</a></li>
            <li><a id="department-6" href="link">Racing</a></li>
            <li><a id="department-12" href="link">Mountain</a></li>
        **</ul>**
    **</li>**          
</ul>

Ответы [ 2 ]

3 голосов
/ 05 мая 2011 

jQuery(".menu").children("a").each(function()
{
    jQuery(this).nextUntil("a").add(this).wrapAll("<li></li>");
    jQuery(this).nextUntil("a").wrapAll("<ul></ul>");

});

jsfiddle

Нужно ли объяснение?

РЕДАКТИРОВАТЬ упс! Я не видел классов на них: 

jQuery(".menu").children("a").each(function()
{
    jQuery(this).nextUntil("a").add(this).wrapAll("<li></li>");
    var jUL = jQuery("<ul></ul>").addClass("acitem");
    jQuery(this).nextUntil("a").wrapAll(jUL);

});

jsFiddle

0 голосов
/ 05 мая 2011

Какой красивый вызов!Здесь у вас есть.Протестировано в FF 3.6 и работает! 

function fixMarkup(){
    var liFamilies = [];
    var iFamily = 0;
    $(".menu li").each(function(){
      if($(this).prev().is("a")) 
        liFamilies[iFamily] = [this]; //Start a family
      else
        liFamilies[iFamily].push(this); //Append to family
      if($(this).next().is("a")) iFamily++; //A new family begins
    });
    //console.log(liFamilies);
    for(var i = 0; i< liFamilies.length; i++){
      var family = liFamilies[i];
      $(family).wrapAll('<ul class="acitem" />');  
      var ulNew = $(family[0]).parent()[0];
      var aElem = $(ulNew).prev()[0];  
      $([aElem, ulNew]).wrapAll("<li/>");
    }
 }   
 $(document).ready(function(){
    fixMarkup();
 });
...