Javascript 是否将同一框中的内容捕获到数组中？

我的HTML格式如下：

<div id='main-post' class='my-post'>
$start
   content 1
$end
$start
   content 2
$end
$start
   content 3
$end
$start
   content 4
$end
</div>

---

这是

$start

和

$end

之间匹配块的正则表达式问题：

<div id='main-post' class='my-post'>
$start
   content 1
$end
$start
   content 2
$end
$start
   content 3
$end
$start
   content 4
$end
</div>

var content = $('#main-post').text(),
re = /\$start([\s\S]*?)\$end/g,
thecontent = [];

while ((match = re.exec(content)) !== null) {
    thecontent.push($.trim(match[1]))
}

<div id='main-post' class='my-post'>
$start
   content 1
$end
$start
   content 2
$end
$start
   content 3
$end
$start
   content 4
$end
</div>

因为JavaScript没有“点匹配全部”修饰符，所以我使用

[\s\s]

技巧来完成同样的事情

<div id='main-post' class='my-post'>
$start
   content 1
$end
$start
   content 2
$end
$start
   content 3
$end
$start
   content 4
$end
</div>

旧答案

<div id='main-post' class='my-post'>
$start
   content 1
$end
$start
   content 2
$end
$start
   content 3
$end
$start
   content 4
$end
</div>

此处暗中刺伤，但如果您想获取

#main post

下每个子节点的文本内容：

<div id='main-post' class='my-post'>
$start
   content 1
$end
$start
   content 2
$end
$start
   content 3
$end
$start
   content 4
$end
</div>

var thecontent = $('#main-post')
    .children()
    .map(function() {
        return this.textContent || this.innerText || '';
    })
    .get();

---

晚会迟到了，但我想我还是会把这个发出去。它有点脆弱，因为它假定原始文本结构（带有自定义分隔块$start/$end）是干净有序的），但它应该与问题中提供的示例一起工作

<div id='main-post' class='my-post'>
$start
   content 1
$end
$start
   content 2
$end
$start
   content 3
$end
$start
   content 4
$end
</div>

var raw_content = $('#main-post').text();
var the_content = raw_content.split(/(?:\s*\$(?:start|end)\s*)+/).slice(1, -1);

另外，我今天了解到，如果string.split（）中使用的regexp包含捕获括号，那么它们将是结果数组的一部分！因此，我必须明确地添加（？：）以使它们不被捕获

<div id='main-post' class='my-post'>
$start
   content 1
$end
$start
   content 2
$end
$start
   content 3
$end
$start
   content 4
$end
</div>

var div = document.getElementById('main-post');

var text = div.textContent;

var theContent = [];
text.replace(/\$start([\s\S]*?)\$end/g, function(s, match) {
  theContent.push(match.trim());
});

console.log(theContent);

<div id='main-post' class='my-post'>
$start
   content 1
$end
$start
   content 2
$end
$start
   content 3
$end
$start
   content 4
$end
</div>

将同一框中的内容捕获到数组中？

<div id='main-post' class='my-post'>
$start
   content 1
$end
$start
   content 2
$end
$start
   content 3
$end
$start
   content 4
$end
</div>

        $(document).ready(function() {  
            var thecontent = [];  
            thecontent[0] = "nuovo content";  
            thecontent[1] = "nuovo content";  
            thecontent[2] = "nuovo content";  
            thecontent[3] = "nuovo content";  

            /* The same as above  
            var thecontent = [  
                "nuovo content 1",  
                "nuovo content 2",  
                "nuovo content 3",  
                "nuovo content 4"  
            ]  
            */  
            $(".content").each(function(index) {  
                console.log($(this).html());  
                $(this).html(thecontent[index]);  
            });  
        });  
</script>  

$（文档）.ready（函数（）{
var-thecontent=[]；
内容[0]=“nuovo内容”；
内容[1]=“nuovo内容”；
内容[2]=“nuovo内容”；
内容[3]=“nuovo内容”；
/*同上
var thecontent=[
“nuovo内容1”，
“nuovo内容2”，
“nuovo内容3”，
“nuovo内容4”
]  
*/  
$（“.content”）.each（函数（索引）{
log（$（this.html（））；
$（this.html（内容[索引]）；
});  
});  

内容1

内容2

内容3

内容4

第一个场景

<div id='main-post' class='my-post'>
$start
   content 1
$end
$start
   content 2
$end
$start
   content 3
$end
$start
   content 4
$end
</div>

如果

$start

和

$end

是DOM节点，并形成如下语法：

<div id='main-post' class='my-post'>
$start
   content 1
$end
$start
   content 2
$end
$start
   content 3
$end
$start
   content 4
$end
</div>

<div>
    <span>$start</span>
    content 1
    <span>$end</span>
    <span>$start</span>
    content 2
    <span>$end</span>
</div>

<div>
    <span>
        content 1
    </span>
    <span>
        content 2
    </span>
</div>

这将获取作为父div的直接子级的每个文本节点，并将其放入数组中

<div id='main-post' class='my-post'>
$start
   content 1
$end
$start
   content 2
$end
$start
   content 3
$end
$start
   content 4
$end
</div>

第二种情况 如果您的

$start

和

$end

分别是开始标记和结束标记，如下所示：

<div id='main-post' class='my-post'>
$start
   content 1
$end
$start
   content 2
$end
$start
   content 3
$end
$start
   content 4
$end
</div>

<div>
    <span>$start</span>
    content 1
    <span>$end</span>
    <span>$start</span>
    content 2
    <span>$end</span>
</div>

<div>
    <span>
        content 1
    </span>
    <span>
        content 2
    </span>
</div>

这将获取父节点的直接子节点的所有内容，并将它们放入数组中

<div id='main-post' class='my-post'>
$start
   content 1
$end
$start
   content 2
$end
$start
   content 3
$end
$start
   content 4
$end
</div>

---

如果这没有回答您的问题，您应该提供一个更详细的问题示例，甚至一个演示。

我不明白，

$start

和

$end

是什么？它们当然不是HTML。@Jack:是的。这是一个特别的内容。@happi如果你不说，人们根本帮不了你。这是如何呈现的？还有什么其他因素在起作用？@Nico:对不起，如果我的问题让每个人都困惑的话，我怀疑这是他问的问题，但我对你勇敢地回答他的“问题”感到惊讶@Jack:谢谢。但是内容返回的未定义如下：我相信

$start

和

$end

是自制的标识符（只是文本），他希望捕获它们之间的任何内容。我的正则表达式技能不太好…比如

\$start（+.+）\$end

并将捕获的组存储到数组中。@happi是的，因为他解决了另一个问题。您应该尝试理解他的代码，而不是仅仅指出它是未定义的。要了解要点并不难。@m59：你的权利。我想抓住它。你喜欢

[\s\s]

把戏吗？；-）@杰克：是的！它比我做的垃圾更干净，所以我想我应该更新，因为我们有不同的方法

exec

vs

replace

。干得好您得到了我的支持：）+1尽管就个人而言，我更喜欢匹配而不是拆分，因为它更容易推理：）捕捉括号的有趣行为，这与pcre不同，pcre必须明确指定意图：）

<div id='main-post' class='my-post'>
$start
   content 1
$end
$start
   content 2
$end
$start
   content 3
$end
$start
   content 4
$end
</div>