Javascript 重新格式化我的jQuery以仅选择该类下的p

我正在为1000多个标题编写索引。我有两个jsfiddle，其中一个可以工作，但编写所有标题需要花费我很多时间。所以我找到了一种复制索引并将其转换为html的方法，但它被列为所有的p，并且不确定我是否还能让它工作。这里是小提琴和代码的工作之一

当我复制粘贴内容并将其转换为html时，我得到了这个结果，我为第一个标题添加了2个类，但我必须将其添加到1000个标题中

<p class="title">50010 title of My book</p>
<p class="title-contents"><strong>Class Code:</strong> 50010</p>
<p><strong>author</strong> me</p>
<p><strong>Note:</strong></p>
<p>The following shall be sold separately:</p>
<ul>
<li>cover</li>
<li>index</li>
</ul>

<p>50011 title of My 2nd book- notice no class</p>
<p><strong>Class Code:</strong> 50011</p>
<p><strong>author</strong> me</p>
<p><strong>Note:</strong></p>
<p>The following shall be sold separately:</p>
<ul>
<li>cover</li>
<li>index</li>
</ul>

---

也许我不理解这个问题或期望的结果，但是如果您所有的标记都遵循上面列出的相同模式，那么我认为您可能考虑过了这个问题。您是否尝试过在文本编辑器中使用简单的查找和替换来添加类？例如，对于标题类，您可以搜索：

"<p>5" and replace it with "<p class="title">5"

对于标题内容类，您可以搜索：

"<p><strong>Class Code:" and repleace it with "<p class="title-contents"><strong>Class Code:"

当然，我不知道你的内容的完整程度，所以你需要评估每个实例，确保它遵循模式，或者根据模式定制模式，但这将为你提供你想要的类结构

这也假设您不需要动态解决方案，因为您提到了复制和粘贴

请注意，这不是一个程序化的解决方案，这只是一个一次性场景的实用解决方案。

这里有一种方法来包装每个部分。它还隐藏部分中除标题外的所有元素，单击标题将切换该部分中的所有其他元素，有点像手风琴

var $ul = $('ul').hide()
// work from bottom up wrapping elements into sections
for (var i = $ul.length - 1; i >= 0; i--) {
    var list = $ul.eq(i)
    list.add(list.prevUntil('ul')).wrapAll('<div class="section">')
}
// work through sections adding behaviors 
$('.section').each(function(){   
  var $p= $(this).children('p').hide();
  $p.eq(0).show().addClass('title').click(function(){
      $(this).siblings().toggle()
  });
})

---

不是的有效父级。使用无效结构操纵DOM是非常困难的。浏览器可能无法以您在无效标记中显示的方式呈现内容。您如何转换此新html？什么是数据源？如果有一种方法可以包装部分，那将非常有帮助……否则，如果每个部分的元素结构都相同，那么在不手动添加类的情况下完成这项工作是可行的。您必须更具体地了解您要实现的目标以及生成html的内容。但是无效的结构应该首先更正。我正在从pdf复制内容。我不想将pdf转换为html，因为它会将所有内容添加到代码中。所以我可以复制文本并把它放在上面这个网站上，但它使用了所有的p。我想我可以继续使用我拥有的另一个版本，并单独复制每个标题，只是为了节省时间。谢谢charliefl，我现在就试试这个，我没有想到。如果结构是一致的，那么使用jQuery将所有这些解析成json并存储在数据库中就不需要花太多时间了。谢谢，这很好。通过使用转换器，我知道我应该使用一个结构，将其转换为html，并使用您的解决方案，我将在10分钟内完成1000+索引。谢谢。是的，我知道你要做什么了，这比我的其他方法更有效。我可以先试试charlietfl的解决方案，如果不行，我会试试你的想法。谢谢

"<p>5" and replace it with "<p class="title">5"

"<p><strong>Class Code:" and repleace it with "<p class="title-contents"><strong>Class Code:"

var $ul = $('ul').hide()
// work from bottom up wrapping elements into sections
for (var i = $ul.length - 1; i >= 0; i--) {
    var list = $ul.eq(i)
    list.add(list.prevUntil('ul')).wrapAll('<div class="section">')
}
// work through sections adding behaviors 
$('.section').each(function(){   
  var $p= $(this).children('p').hide();
  $p.eq(0).show().addClass('title').click(function(){
      $(this).siblings().toggle()
  });
})