Question

是否可以将以下html修改为本页底部链接的源代码？我对源页面的脚本访问权限有限，因此我正在寻找一种使用jquery或js更改页面的方法。

此外，部门ID将是完全随机的，并且相对于每个组将存在不同数量的链接，因此它将需要是动态的。我试过追加但是我在插入开始或结束标签方面遇到了麻烦，所以不确定如何解决这个问题。提前感谢您提供的任何帮助。

我在代码中需要的添加内容标有**的

原始来源：

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

Answer 1

<击>

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

Answer 2

多么美好的挑战！你有。在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();
 });

jquery / javascript将ul / li元素插入到这个html中

2 个答案: