用jquery操作html，向<ul><li></li><li></li></ul>的第一li后面追加</ul><ul>的问题

$("#my_sp").after("</ul><ul>");看你清楚，你加的是什么？你觉得那样加进去后，html变成什么样了？

解决方案 »

免费领取超大流量手机卡，每月29元包185G流量+100分钟通话, 中国电信官方发货

$("#my_sp").after("</ul><ul>");
$(".subitem ul:last").after("</ul><ul>");
function OK() {
$(".subitem").html($(".subitem").html().replace(/(<li.*?id="my_sp"[\s\S]*?<\/li>)/g,"$1</ul><ul>"));
}
这个：之前是这样的结构：
                         <ul>
                              <li><a>烷烃及衍生物</a></li>
                              <li><a>烷烃及衍生物</a></li>
                              <li><a>烷烃及衍生物</a></li>
                              <li id="my_sp"><a>烷烃及衍生物</a></li>
                              <li><a>烷烃及衍生物</a></li>
                              <li><a>烷烃及衍生物</a></li>
                              <li><a>烷烃及衍生物</a></li>
                         </ul>
我想用这个方法： $("#my_sp").after("</ul><ul>");往中间加上</ul><ul>,你们看结构就知道，我是要</ul>这个结束标记，和上面的配对；让<ul>这个开始标记，和下面的配对。
将上面的ul块切成两个 ul块，成为下面的结构：
                         <ul>
                              <li><a>烷烃及衍生物</a></li>
                              <li><a>烷烃及衍生物</a></li>
                              <li><a>烷烃及衍生物</a></li>
                              <li id="my_sp"><a>烷烃及衍生物</a></li>
                          </ul>
                          <ul>
                              <li><a>烷烃及衍生物</a></li>
                              <li><a>烷烃及衍生物</a></li>
                              <li><a>烷烃及衍生物</a></li>
                         </ul>
，但是浏览器自动配对，将我的</ul><ul>, 转化成了<ul></ul>,我想问，这个怎么解决？
哥哪能这么搞？你本是字符串操作，却要起到节点效果。<ul>
    <li><a>烷烃及衍生物</a></li>
    <li><a>烷烃及衍生物</a></li>
    <li><a>烷烃及衍生物</a></li>
    <li id="my_sp"><a>烷烃及衍生物</a></li>
    <li><a>烷烃及衍生物</a></li>
    <li><a>烷烃及衍生物</a></li>
    <li><a>烷烃及衍生物</a></li>
</ul>
<button type="button">我擦</button>
<script type="text/javascript">
$(function(){
    $("button").click(function(){
        $("ul").after($("<ul/>").append($("#my_sp").nextAll()));
    })
})
</script>
sorry，我错了，没看下面的代码，没有格式化的代码很多时候不看的，看的眼睛难受。明白你的意思了，不过，只能说，你不是一个有正常思维的人，这句话怎么像骂人呢!我的意思是，如果对于html，dom的东西比较了解的话，是不会像你那样弄的。
而且按一般人的想法，肯定是再新建一个ul，把其中一部分li搬到新的ul里面去，不会像你这样的搞法
引用7楼的，这样可以
嗯，这个我试了，可以的，不过正则表达式我不太懂，你能帮我解释下  replace(/(<li.*?id="my_sp"[\s\S]*?<\/li>)/g,"$1</ul><ul>"));
这个里面正则表达式的意思么，前面的 "/" 是所有的正则表达式都要用 /开头吗？还有后面的 $1，应该是jquery里面的，是什么意思呢？  谢谢。
嗯，这个我试了，可以的，不过正则表达式我不太懂，你能帮我解释下  replace(/(<li.*?id="my_sp"[\s\S]*?<\/li>)/g,"$1</ul><ul>"));
这个里面正则表达式的意思么，前面的 "/" 是所有的正则表达式都要用 /开头吗？还有后面的 $1，应该是jquery里面的，是什么意思呢？  谢谢。
innerHTML  vs dom操作(W3c）<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>Insert title here</title>
<style>
#select {
border: 1px solid red;
}#select li {
background-color: #2aa;
padding: 20px;
}
</style>
</head>
<body>
<div class="subitem" id='cc'>
            <ul>
                <li><a>烷烃及衍生物</a></li>
                <li><a>烷烃及衍生物</a></li>
                <li><a>烷烃及衍生物</a></li>
                <li id="my_sp">
                    <a>看我后面是否被</ul><ul>分割开</a>
                </li>

                <li><a>烷烃及衍生物</a></li>
                <li><a>烷烃及衍生物</a></li>
                <li><a>烷烃及衍生物</a></li>
           </ul>
        </div>

<script>
function youWant(){
//var subitem0 = document.getElementById("cc");
var subitem0 = document.getElementsByClassName("subitem")[0];
var html = subitem0.innerHTML;

var newhtml = html.replace(/(<li.*?id="my_sp"[\d\D]*?<\/li>)/g,"$1</ul><ul>");
subitem0.innerHTML = newhtml;
}
youWant();</script> </body>
</html>
(<li.*?id="my_sp"[\d\D]*?<\/li>) 什么意思
/(<li.*?id="my_sp"[\d\D]*?<\/li>)/   是个简单的，再也没有比这个更简单的正则表达式。
*? 注意下是非贪婪就可以了。
[\d\D]是所有字符包括换行 *代表0个或1一个以上[\d\D] $1是括号括起来的部分可以多个括号 $1,$2,$3..
你上w3c看一下正则表达式就知道了