通过查找关键字将Javascript字符串拆分为字符串数组

处理一个个人项目，该项目通过插入文本区域的HTML文档进行解析，并生成一个新的HTML文档并进行附加修改。 我的问题是，我想用class=“dog”将某些div分割成一个数组，数组中的每个元素都是dog类的div

HTML:

JS理念：

dogs[x] = intext.slice(intext.indexOf('<div class="dog"'), /*next instance of dog*/);

---

dogs[x]=intext.slice（intext.indexOf（“存在一种称为查询选择器的功能。通过这些功能，您可以选择具有特定类的所有元素，或特定标记的所有元素

这将适合您的具体需要：

常规的
querySelector（）
将只选择第一个元素，这就是您需要使用
querySelector（）
的原因。它将为您提供一个可以继续使用的元素列表

示例：

var dogDivs = document.querySelectorAll(".dog");

编辑：
正如您刚才提到的，它是来自textarea的文本，正如您所建议的，您可以首先将其加载到DOM结构中。最好是在隐藏元素中，以便用户不知道它

var elements = document.getElementsByClassName('dog'); 
var arr = [].slice.call(elements);

arr是您想要的数组。元素是HTMLCollection，没有数组原型方法。
您不应该将html解析为字符串。使用
DOMParser
将其转换为文档，然后可以使用所有标准方法

var parser = new DOMParser();
var doc = parser.parseFromString(stringContainingHTMLSource, "Text Area Content");

divs = doc.getElementsBYTagName("div");

然后您可以使用内置的
文档
界面

获取所有div的数组：
document.getElementsByTagName（“div”）；

获取具有特定类的所有div的数组：
document.getElementsByClassName（“dog”）；

获取具有特定id的所有div的数组：
document.getElementById（“id”）；

可以在上找到非常有用的方法的完整列表。
首先，您需要将内容加载到DOM：

document.createElement("div").innerHtml(intext);

然后，您可以找到其他答案所建议的狗元素：

var elements = document.getElementsByClassName('dog');

在将用户输入的数据加载到DOM中时要小心，这可能会打开被黑客攻击的大门。
对于您正在做的事情，您不使用切片工具。这将用于字符串，您不使用的索引，因为这只是搜索字符串中的特定部分

您想要使用的是

document.querySelectorAll(".example");

您将把类dog放在.example格式相同的地方。
此命令将返回所有可能div的数组

如果您需要更多帮助，请转到此链接
您可以尝试使用类dog获取所有元素：

var dogs = document.getElementsByClassName("dog");

但这将返回类dog的所有元素。然后您可以尝试以下代码段：

function splitByClass(tag, cl) {
 var els = document.getElementsByClassName(cl);

 var res = [];

 for (i = 0; i < els.length; i++) {
   if (els[i].tagName.toLowerCase() == tag.toLowerCase()) {
            res.push(els[i]);
   }
 }

 return res;
}

console.log(splitByClass("div","dog"));

函数splitByClass（标记，cl）{
var els=document.getElementsByCassName（cl）；
var-res=[]；
对于（i=0；i
如果您想将其解析为文本，而不将其转换为DOM对象，则如果用户输入格式有任何错误，则可能会出现错误。请尝试类似我在此处建议的用于搜索XML代码的解决方案：


这将允许您搜索开始标记（例如和结束标记），您只需根据搜索开始/结束标记（例如div）的大小调整.substring的大小。
为什么不在解析器中将其解析为HTML，并使用内置方法代替。var elements=document.getElementsByClassName（'dog'））；我明白你的意思，但是我接受javascript作为来自文本区域的输入。如果我有类为“dog”的元素怎么办这不是div？那么列表将是空的。我没有提到我是通过textarea检索输入的。我没有提到我是通过textarea获取输入的。我更新了它以用于textarea。你仍然应该不惜一切代价避免手动解析。只要它严格在客户端，漏洞就不是一个真正的问题，是吗？是的，我只是将其用于个人用途（将使用新类修改现有html）。但我通过文本区域而不是DOM接收输入。是否有使用纯字符串方法的类似解决方案？@FroyT是的，您开始这样做的方式是可能的，但这是最糟糕的方式。您很快就会非常痛苦。使用此解决方案，您可以执行类似于
element.className+=”的操作+newClassName；
而如果使用字符串操作，则需要花费数小时来计算字符数和解析简单元素。
var dogs = document.getElementsByClassName("dog");

function splitByClass(tag, cl) {
 var els = document.getElementsByClassName(cl);

 var res = [];

 for (i = 0; i < els.length; i++) {
   if (els[i].tagName.toLowerCase() == tag.toLowerCase()) {
            res.push(els[i]);
   }
 }

 return res;
}

console.log(splitByClass("div","dog"));