Question

好的，我的div中有以下数据

<div id="mydiv">
<!--
 what is your present
 <code>alert("this is my present");</code>
 where?
 <code>alert("here at my left hand");</code>
 oh thank you! i love you!! hehe
  <code>alert("welcome my honey ^^");</code>
-->
</div>

我需要做的就是获取<code>块内的所有脚本和html代码文本节点，而不删除里面的html注释。以及我的教授给我的作业，我不能修改那个div块。

我需要使用正则表达式，这就是我所做的

var block = $.trim($("div#mydiv").html()).replace("<!--","").replace("-->","");
var htmlRegex = new RegExp(""); //I don't know what to do here
var codeRegex = new RegExp("^<code(*n)</code>$","igm");

var code = codeRegex.exec(block);
var html = "";

它真的不起作用...请不要给出确切的答案..请教我..谢谢

我需要为变量code

设置以下块

alert("this is my present");
alert("here at my left hand");
alert("welcome my honey ^^");

这是变量html

所需的块

 what is your present
     where?
     oh thank you! i love you!! hehe

我的问题是获得上述结果的正则表达式模式是什么？

Answer 1

使用正则表达式解析HTML不是您应该做的事情。

我确信你的教授认为他/她真的很聪明，并且没有办法访问DOM API并且可以挥动横幅并证明使用正则表达式来解析DOM的一些小角落，有时它是好的。

嗯，不，不是。如果你有复杂的代码，会发生什么？你的正则表达式中断了，如果它正在生产中，它可能会成为一种安全漏洞。

所以，在这里：

http://jsfiddle.net/zfp6D/

走dom，从节点中获取nodeType 8（注释）文本值。
调用HTML解析器（浏览器用来解析HTML的东西，而不是正则表达式，为什么你不会使用HTML解析器解析HTML完全超出我的意思，就像说“是的，我可以钉在这个钉子里用锤子，但我想我会用脚踩钉子直到它进入“）。
查找新解析的HTML中的所有CODE元素。
将它们记录到控制台，或者您想要用它们做什么。

Answer 2

首先，您应该知道，因为HTML不是常规语言，所以不能使用适用于所有有效输入的正则表达式进行泛型解析（特别是通用嵌套不能用正则表达式表示）。许多解析器确实使用正则表达式来匹配单个标记，但是需要围绕它们构建其他算法

但是，对于像这样的固定输入，只是处理你所拥有的结构的情况（尽管使用不同于正则表达式的解析方法仍然更容易）。

首先让我们获取所有代码：

var code = '', match = [];
var regex = new RegExp("<code>(.*?)</code>", "g");
while (match = regex.exec(content)) {
    code += match[1] + "\n";
}

我认为content包含您已经提取的div的内容。这里的“g”标志表示这是“全局”匹配，因此我们可以重用正则表达式来查找每个匹配项。括号表示捕获组，.表示任何字符，*表示重复0次或更多次，?表示“非贪婪”（看看没有它会发生什么事情看看它是什么一样）。

现在我们可以做类似的事情来获取所有其他位，但这次正则表达式稍微复杂一些：

new RegExp("(<!--|</code>)(.*?)(-->|<code>)", "g")

此处|表示“或”。因此，这匹配以“开始注释”或“结束代码”开头并以“结束注释”或“开始代码”结束的所有位。另请注意，我们现在有3组括号，因此我们要提取的部分是match[2]（第二组）。

Answer 3

你做了很多不必要的事情。 .html（）以字符串形式提供内部内容。您应该能够使用regEx从中获取您需要的内容。另外，尝试坚持使用regEx文字（例如/^regexstring$/）。你必须使用新的RegExp来逃避转义字符，它会变得非常混乱。当您需要将字符串var放入regEx时，通常只想使用新的RegExp。

字符串的匹配函数接受regEx并在添加全局标志时返回每个匹配的集合（例如/^regexstring$/g＆lt; - 注意'g'）。我会做这样的事情：

var block = $('#mydiv').html(), //you can set multiple vars in one statement w/commas
matches = block.match(/<code>[^<]*<\/code>/g);

//[^<]* <-- 0 or more characters that aren't '<' - google 'negative character class'

matches.join('_') //lazy way of avoiding a loop - join into a string with a safe character
.replace(/<\/*code>/g,'') //\/* 0 or more forward slashes
.split('_');//return the matches string back to array

//Now do what you want with matches. Eval (ew) or append in a script tag (ew).
//You have no control over the 'ew'. I just prefer data to scripts in strings

与Regex JS模式混淆

3 个答案: