Javascript 在<；中插入动态创建的列表项；ol>；使用jquery

我正试图找到一个脚本，该脚本使用

class=SO Para number List

查找段落，取出

span

元素将段落转换为

li

，然后创建一个

ol

，并在其中添加所有列表项

这是HTML结构

<p class="SOPara">Lorem ipsum dolor sit amet, consectetur adipisicing elit. </p>
        <p class="SO-Para-Numbered-List"><span>i</span> some text </p>
        <p class="SO-Para-Numbered-List"><span>ii</span> some text</p>
        <p class="SO-Para-Numbered-List"><span>iii</span> some text </p>
        <p class="SO-Para-Numbered-List"><span>iv</span> some text</p>
        <p class="SO-Para-Numbered-List"><span>v</span> some text</p>
        <p class="SO-Para-Numbered-List"><span>vi</span>  some text</p>
        <p class="SO-Para-Numbered-List"><span>vii</span> some text </p>
<p class="SOPara">Lorem ipsum dolor sit amet, consectetur adipisicing elit. </p>

---

}))

您当前正在

li

元素上设置

列表样式类型，而它应该在
ol
上。另外，使用
add（）
也没有您想要的效果，您应该使用
append（）

要实现所需功能，您可以创建一个新的
ol
，并将其保存在变量中。这将允许您在循环中直接向其添加
append（）
，同时删除原始
SO Para…
元素。试试这个：

var $ol = $('<ol class="newList">').insertBefore('.SO-Para-Numbered-List:first()');

$(".SO-Para-Numbered-List").each(function() {
    $ol.append("<li>" + $(this).find('span').remove().end().text() + "</li>");
}).remove();

var$ol=$（''）.insertBefore（'.SO参数编号列表：first（））；
$（“.SO段编号列表”）。每个（函数（）{
$ol.append（“
”+$（this.find（'span'）.remove（）.end（）.text（）+”
”）；
}).remove（）；

您可以使用
insertBefore（）
获取对
ul
的引用，然后将
li
附加到该引用上


$（文档）.ready（函数（）{
var$ul=$（“”）。insertBefore（‘。所以参数编号列表：first’）；
//对于每个段落项目
$（“.SO段编号列表”）。每个（函数（）{
$（this.find（“span”）.remove（）；
var thisContent=$（this.text（）；
$（“
”{
“类”：“SOlistItem”，
正文：此内容
}).css({
“列表样式类型”：“下罗马”
}).appendTo（$ul）；
}).remove（）；
});

知识产权不受欢迎，成为精英
我有一些文字
ii一些文本
iii一些文本
iv一些文本
v一些文本
vi一些文本
vii一些文本
Lorem ipsum door sit amet，concetetur adipising elit.
尝试附加功能：


$（文档）.ready（函数（）{
$（“”）.insertBefore（‘。因此，段编号列表：first’）；
//对于每个段落项目
$（“.SO段编号列表”）。每个（函数（）{
//删除跨度
$（this.find（“span”）.remove（）；
//保存文本
var thisContent=$（this.text（）；
//将项目添加到列表中
$（“ol.newList”）.append（
“+thisContent+“
”）；
$（this.remove（）；
});
});

知识产权不受欢迎，成为精英
我有一些文字
ii一些文本
iii一些文本
iv一些文本
v一些文本
vi一些文本
vii一些文本
Lorem ipsum door sit amet，concetetur adipising elit.
$（“.因此段编号列表：第一”）。在（“”）之前；
$（“p.SO-Para-number-List”）。每个（函数（）{
var getText=$（this.clone（）.children（）.remove（）.end（）.text（）；
$（“.newList”）.append（“
”+getText+”
”）；
}).remove（）；

工作提琴：
@RayonDabre否将是
一些文本
是否有一种方法让代码对页面上的每组元素执行相同的操作，即创建一个编号从1开始的新列表，但对于它遇到的每组
i一些文本
？我试着设置它，以便找到前面的SOPara，这是一个段落，总是在我想变成列表项的段落之前，但我被卡住了——
<ol>       
    <li style="list-style-type:lower-roman;" class="SOlistItem"> some text </li>        
    <li style="list-style-type:lower-roman;" class="SOlistItem"> some text </li>
    <li style="list-style-type:lower-roman;" class="SOlistItem"> some text </li>
    <li style="list-style-type:lower-roman;" class="SOlistItem"> some text </li>        
</ol> 

$(document).ready(function(){
$(".SO-Para-Numbered-List").each(function(){
    if($(this).prev("p").hasClass("SOPara")){
        $(this).before("<ol class='newList'></ol>");
        $(this).siblings().nextUntil(".SOPara").each(function(){
        var $this = $(this);
        $(this).find("span").remove();
        var listContent = $(this).text();
        var newListItem = $(this).replaceWith("<li>"+listContent+"</li>");
        });//end siblings function
    }//end if
})//end SO Para function

var $ol = $('<ol class="newList">').insertBefore('.SO-Para-Numbered-List:first()');

$(".SO-Para-Numbered-List").each(function() {
    $ol.append("<li>" + $(this).find('span').remove().end().text() + "</li>");
}).remove();

$(".SO-Para-Numbered-List:first").before("<ol class='newList'>");
$("p.SO-Para-Numbered-List").each(function() {
    var getText = $(this).clone().children().remove().end().text();
    $(".newList").append('<li>'+getText+'</li>');
}).remove();