Javascript 如果满足条件，则查找子字符串

我可以访问单个字符串中的大量HTML：

const{body_html}=this.props.product_页面

我正在尝试仅使用字符串解析更新此HTML。具体来说，我希望在找到特定子字符串后找到第一个div closing元素：

产品说明

挑战在于产品页面的动态特性。第一个结束div和子字符串product.description结尾之间将有未知数量的字符

我怎样才能注射你好，世界！在第一个结束div之后-在找到产品描述变量之后

---

编辑：我知道以这种方式修改HTML的做法很糟糕，但由于技术限制，这些是我必须满足的条件。此外，这不是纯HTML代码，而是嵌入Ruby模板的液态代码。最后，我从来没有特别要求正则表达式。用子字符串indexOf就足够了吗？或者这在技术上是一样的吗？

这里有一个小主意供您使用

假设您有以下html字符串

var myStr = "<div><span>Hello<span><div>SearchString<div>Lorem Ipsum is simply dummy text of the printing and typesetting industry. Lorem Ipsum has been the industry's standard dummy text ever since the 1500s, when an unknown printer took a galley of type and scrambled it to make a type specimen book. It has survived not only five centuries, but also the leap into electronic typesetting, remaining essentially unchanged. It was popularised in the 1960s with the release of Letraset sheets containing Lorem Ipsum passages, and more recently with desktop publishing software like Aldus PageMaker including versions of Lorem Ipsum.</div></div></div>";

现在，首先使用myStr.indexOf找到这个字符串的索引，并使用它作为子字符串，直到结束，然后找到最接近的

myStr.substr(myStr.indexOf(searchString),myStr.length).indexOf('</div>')

现在有了索引，您必须在其中插入字符串。把它插进去，你就可以走了

---

首先，这不是一个好的做法。您应该尝试使用HTML解析器

但为了回答您的问题，下面是同样的示例代码

var mySearchStr = "<div> Test String 1 </div><div> myString is this </div><div> New string should be before this </div>";

var searchStrIndex = mySearchStr.indexOf("myString");

var closingDivIndex = mySearchStr.indexOf("</div>", searchStrIndex + 1); // Div after the first occurence of search string

var firstPart = mySearchStr.substring(0, closingDivIndex + 6);  // 6 is the length of </div>

var secondPart = mySearchStr.substring(closingDivIndex + 6);

var finalString = firstPart + "<div> My New content </div>" + secondPart;

alert(finalString);

使用正则表达式可能有更好的方法。但我不是那里的专家

。到目前为止，最好的方法是正确地解析HTML：使用HTML解析器。毕竟，浏览器中内置了一个。如果您试图用简单的字符串处理来实现这一点，那么它很可能会咬到您

带子字符串的indexOf就足够了吗？或者从技术上讲这是同一回事吗

不完全是，div的结束标记可以是空格，也可以是任意数量的空格，包括换行符、制表符等。。实际上，浏览器也允许/和div之间存在空格

因此，您需要一个正则表达式来查找结束标记。比如：

var str=testing product.description}}\n； var match=/product\.description[\s\s]*？/.execstr； console.logOriginal字符串：+str； 如果匹配{ var index=match.index+match[1]。长度； console.logIt的索引+索引； str=str.substring0，索引+ 你好，世界+ str.substringindex； console.logNew字符串：+str； }否则{ console.logNot found； } .作为控制台包装{ 最大高度：100%！重要；

---

}在这里使用regex听起来像是一个很好的烧焦方法，或者至少在路上有虫子。相反，我建议改用HTML解析器。到目前为止，最好的方法是正确地解析HTML：使用HTML解析器。毕竟，浏览器中内置了一个。我不知道是谁否决了所有人对这个问题的回答，但谢谢。你会如何扩展你的答案来支持把手？{{product.description}}@ilrein:如果product.description在{{{}中最终以/product\.description[^I之所以修改它，是因为我无法与换行符匹配。请尝试使用HTML字符串：我想最后一次迭代：/product\.description[\S\S]*/

var mySearchStr = "<div> Test String 1 </div><div> myString is this </div><div> New string should be before this </div>";

var searchStrIndex = mySearchStr.indexOf("myString");

var closingDivIndex = mySearchStr.indexOf("</div>", searchStrIndex + 1); // Div after the first occurence of search string

var firstPart = mySearchStr.substring(0, closingDivIndex + 6);  // 6 is the length of </div>

var secondPart = mySearchStr.substring(closingDivIndex + 6);

var finalString = firstPart + "<div> My New content </div>" + secondPart;

alert(finalString);