在 HTML 中选择部分的正则表达式答案

【问题标题】：Regular Expression to select part in HTML在 HTML 中选择部分的正则表达式
【发布时间】：2014-10-07 06:19:16
【问题描述】：

我需要从滚动的 HTML 源代码中提取元属性。滚动后的HTML代码包含如下

示例：

<meta property="og:site_name" content="asasasas">
<meta property="og:title" content="asajhskajhsaksp;" /> 
<meta property="og:image" content="images.cxs.com/2014/09/modit1.gif?w=209" />

这里我只想获取 meta property="og:image" 的内容，即结果应该只有

images.cxs.com/2014/09/modit1.gif?w=209

【问题讨论】：

Don't parse HTML with regex!
@Biffen：在这种任务中使用正则表达式有什么问题？没有递归或任何正则表达式无法处理的东西。
@Rawing—HTML 不是正则语言，它不能用正则表达式可靠地解析，尽管您可以使用正则表达式来标记 HTML 解析器中的输入。
@Rawing 您是否阅读了链接的答案？如果property 和content 的顺序相反怎么办？如果里面有其他属性怎么办？如果某处有注释掉的meta 元素怎么办？如果属性中有 HTML 元素怎么办？我可以继续...

标签： javascript html regex

【解决方案1】：

jquery有这么难吗

$('meta[property="og:image"]').attr('content')

【讨论】：

OP 中没有 jQuery 标签或提及它。
之前提到了javascript，所以我认为一个jquery解决方案也可能就足够了

【解决方案2】：

正如@Biffen 所说，不要使用正则表达式来解析 html。

如果变量中有上述字符串，则可以使用 querySelector() 之类的

var html = '<meta property="og:site_name" content="asasasas" /><meta property="og:title" content="asajhskajhsaksp;" /><meta property="og:image" content="images.cxs.com/2014/09/modit1.gif?w=209" />';
var el = document.createElement('div');
el.innerHTML = html;
var meta = el.querySelector('meta[property="og:image"]');
console.log(meta.content);

document.getElementById('result').innerHTML = meta.content;

&lt;div id="result"&gt;&lt;/div&gt;

如果它是当前页面的一部分，那么

var meta = document.querySelector('meta[property="og:image"]');
console.log(meta.content);

document.getElementById('result').innerHTML = meta.content;

<meta property="og:site_name" content="asasasas"/>
<meta property="og:title" content="asajhskajhsaksp;" /> 
<meta property="og:image" content="images.cxs.com/2014/09/modit1.gif?w=209" />

<div id="result"></div>

【讨论】：

嗨@Arun，我正在使用CURL首先抓取网站并将其存储在文件中。 $ch = curl_init ($url); $fp = fopen ($file, "w") 或 die("无法打开 ".$file." 进行写入。\n"); curl_setopt ($ch, CURLOPT_FILE, $fp); curl_close ($ch); fclose ($fp);现在我在那个文件中有 HTML 代码.. 所以接下来我可以像你上面建议的那样继续.. 或者有没有其他方法可以获取除 CURL 之外的网站内容。 Bcoz CURL 抓取整个页面，但我只想要 HTML 的 HEAD 部分..

【解决方案3】：

您可以使用 Arun 建议的方法，但是可能存在不支持 Selectors API 或不支持所需功能（例如 IE8）的用户代理。在这种情况下，您可以使用 getElementsByTagName 和一个普通的旧 for 循环。

var node, nodes = document.getElementsByTagName('meta');
for (var i=0, iLen=nodes.length; i<iLen; i++) {
  node = nodes[i];

  if (node.getAttribute('property') == 'og:image') {

    // do something with content
    console.log(node.content);
  } 
}

以上内容适用于任何正在使用的浏览器，不需要任何外部库。

【讨论】：