Javascript 检查字符串是否位于divjquery的段落内

我有一个字符串列表

my_list = ["A simple sentence" , "Lorem Ipsum" , "Example"]

我想检查列表中的这些字符串是否属于

或

段落中的内容

所以首先我想检查它的每个参数，如果我找到文本，我想替换它只是为了改变字体颜色，例如

style=“color:red；”

我试着这样做：

    my_list = ["A simple sentence" , "Lorem Ipsum" , "Example"]
    if ($("#lead").length) {
        $('p').each(function() {
            for (var i = 0; i < my_list.length; i++) {
                    var text =  my_list[i];
                    var result =  $(this).search(text)
                    if( result != -1){
                       // replace code? a
                       $this.text().replace(text, <p style="color:red;> text </p>)
                    }
                }
        });
   }

my_list=[“一个简单的句子”、“Lorem Ipsum”、“示例”]
if（$（“#导程”）.长度）{
$（'p'）。每个（函数（）{
对于（var i=0；i$this.text（）.replace（text，您可以使用
每个
搜索每个
p
元素，然后为每个数组元素创建RegExp对象，然后使用
replace
找到它并将其包装在
span
元素中。然后您可以将样式应用于
span
元素


var my_list=[“一个简单的句子”、“Lorem Ipsum”、“示例”]；
$（“#lead，#detail”）。查找（'p'）。每个（函数（）{
对于（var count=0；count

.red{
颜色：红色；
}



同侧眼睑

一些文字

这是什么

我们为什么要用它

Lorem Ipsum只是印刷和排版行业的虚拟示例文本

一个简单的句子Lorem Ipsum


$（'p'）。每个
都将搜索页面上
p
的每个实例，因此您需要执行类似
$（'lead p'）的操作。每个
都将搜索
$（'lead'）内部的
p
的每个实例

您还可以向每个容器div添加一个
data
属性，类似于
data name=“search div”
，然后可以执行类似于
$（'[data name=“search div”]p'）。每个

对于字符串替换，您可以这样做

$('[data-name="search-div"] p').each(function() {
  for (var count = 0; count < my_list.length; count++) {
    var text = my_list[count];
    var str = $(this).text();
    if (str.indexOf(text) >= 0) { //This is a case-sensitive search
      $(this).html(
        $(this).html().replace(text, "<span class='red'>$&</span>")
      );
    }
  }
});

$（'[data name=“search div”]p'）。每个（函数（）{
对于（var count=0；count=0）{//这是区分大小写的搜索
$（this.html）(
$（this.html（）.replace（文本“$&”）
);
}
}
});

我有一份工作给你

对于HTML，我只是稍微清理了一下结构，以便
和
标记都正确关闭

<div id="trunk">
  <div id="header">
    <p> ...</p>
    <p> ...</p>
  </div>
  <div id="lead">
    <p>Lorem Ipsum </p>
    <p> some text ... </p>
  </div>
  <div id="detail">
    <p> What is it?</p>
    <p> Why do we use it?</p>
    <p> Lorem Ipsum is simply dummy text of the printing and typesetting industry. Lorem Ipsum!</p>
  </div>
  <div id="another-div">
    <p> ...</p>
    <p> ...</p>
  </div>
</div>

OP表示他只想更改
#lead
和
#details
div中的段落。可能
$（“#lead p，#detailp”）。每个（…）
都可以吗？
<div id="trunk">
  <div id="header">
    <p> ...</p>
    <p> ...</p>
  </div>
  <div id="lead">
    <p>Lorem Ipsum </p>
    <p> some text ... </p>
  </div>
  <div id="detail">
    <p> What is it?</p>
    <p> Why do we use it?</p>
    <p> Lorem Ipsum is simply dummy text of the printing and typesetting industry. Lorem Ipsum!</p>
  </div>
  <div id="another-div">
    <p> ...</p>
    <p> ...</p>
  </div>
</div>

var my_list = ["A simple sentence", "Lorem Ipsum", "Example"];
$('#lead p, #detail p').each(function() {
  var p = $(this);
  for (var i = 0; i < my_list.length; i++) {
    var haystack = p.html();
    var needle = my_list[i];
    if (haystack.split(needle).length > 1) {
      p.html(
        haystack.replace(new RegExp(needle, 'g'), 
        "<span class='red'>" + needle + "</span>")
       );
    }
  }
});

.red {
  color: red;
}