Javascript正则表达式匹配在实际页面上失败，但正则表达式测试工作正常 [英] Javascript regex match fails on actual page, but regex tests work just fine

问题描述

我有一个非常具体的问题，关于Javascript中的正则表达式匹配。我正在尝试匹配一段源代码，更具体地说是这里的一部分：

 < TD WIDTH = 100％ALIGN = right>< a href =http://forum.tibia.com/forum/?action=main&amp;sectionid=2> World Boards< / a> | < a href =http://forum.tibia.com/forum/?action=board&amp;boardid=106121> Olympa  -  Trade< / a> | < b> Yasir时碰撞......< / b>< / TD> 
  

我想要匹配的部分是 boardid = 106121> Olympa - Trade< / a> ，我实际需要的部分是Olympa。所以我使用以下JS代码行获得匹配并返回Olympa：

  var world = document.documentElement.innerHTML.match（'/ boardid = [0-9] +>（[AZ] [az] +）（ - 贸易）{0,1}< \ / a> / i'）[1]; 
  

（ - 交易）部分是可选的在我的问题中，因此正则表达式中的 {0,1} 。

也没有更简单的方法来缩小通过例如代码getElementsByTagName，所以搜索完整的源代码是我唯一的选择。

现在这里有趣的事情。我使用了两个在线正则表达式匹配器（其中一个专门用于JS-regex）来测试我的正则表达式对完整的源代码。两次，它都有一场比赛并且完全按照原样返回Olympa。但是，当Chrome在实际页面上包含脚本时，会出现以下错误：

 事件处理程序中的错误' undefined'：无法读取null的属性'1'TypeError：无法读取属性'1'的null 
  

显然，我的行的第一部分返回null，因为它找不到匹配，并且取null的[1]不起作用。

I想想我可能没有对源代码进行匹配，但是当我让脚本输出 document.documentElement.innerHTML 到控制台时，它会输出完整的源代码。 / p>

我认为这个正则表达式没有理由失败，所以我必须忽略一些非常愚蠢的东西。有没有其他人看到这个问题？

所有帮助赞赏，
Kenneth

解决方案

你将正则表达式放在一个字符串中。它不应该在字符串中。

  var world = document.documentElement.innerHTML.match（/ boardid = [0-9 ] +>（[AZ] [az] +）（ - 交易）{0,1}< \ / a> / i）[1]; 
  

另一件事—看来你有一个文档对象，在这种情况下，所有这些HTML都已经为你解析了，你可以利用它而不是重新发明一个脆弱的轮子。

  var element = document.querySelector（'a [href * =boardid =]'）; 
 var world = element.textContent; 
  

（这假定为你不需要< = IE8支持。但如果你这样做，仍然有更好的方法。）

（PS ？是 {0,1} 的简写。）

I have a very specific problem concerning a regular expression matching in Javascript. I'm trying to match a piece of source code, more specifically a portion here:

<TD WIDTH=100% ALIGN=right><a href="http://forum.tibia.com/forum/?action=main&amp;sectionid=2">World Boards</a> | <a href="http://forum.tibia.com/forum/?action=board&amp;boardid=106121">Olympa - Trade</a> | <b>Bump when Yasir...</b></TD>

The part I'm trying to match is boardid=106121">Olympa - Trade</a>, the part I actually need is "Olympa". So I use the following line of JS code to get a match and have "Olympa" returned:

var world = document.documentElement.innerHTML.match('/boardid=[0-9]+">([A-Z][a-z]+)( - Trade){0,1}<\/a>/i')[1];

the ( - Trade) part is optional in my problem, hence the {0,1} in the regex.

There's also no easier way to narrow down the code by e.g. getElementsByTagName, so searching the complete source code is my only option.

Now here's the funny thing. I have used two online regex matchers (of which one was for JS-regex specifically) to test my regex against the complete source code. Both times, it had a match and returned "Olympa" exactly as it should have. However, when I have Chrome include the script on the actual page, it gives the following error:

Error in event handler for 'undefined': Cannot read property '1' of null TypeError: Cannot read property '1' of null

Obviously, the first part of my line returns "null" because it does not find a match, and taking [1] of "null" doesn't work.

I figured I might not be doing the match on the source code, but when I let the script output document.documentElement.innerHTML to the console, it outputs the complete source code.

I see no reason why this regex fails, so I must be overlooking something very silly. Does anyone else see the problem?

All help appreciated, Kenneth

解决方案

You're putting your regular expression inside a string. It should not be inside a string.

var world = document.documentElement.innerHTML.match(/boardid=[0-9]+">([A-Z][a-z]+)( - Trade){0,1}<\/a>/i)[1];

Another thing — it appears you have a document object, in which case all this HTML is already parsed for you, and you can take advantage of that instead of reinventing a fragile wheel.

var element = document.querySelector('a[href*="boardid="]');
var world = element.textContent;

(This assumes that you don't need <=IE8 support. If you do, there remains a better way, though.)

(P.S. ? is shorthand for {0,1}.)

这篇关于Javascript正则表达式匹配在实际页面上失败，但正则表达式测试工作正常的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！