如何在html字符串中获取标题标记?

时间:2012-11-19 11:30:26

标签: javascript jquery regex

嘿,我正在使用ajax将html页面加载到字符串中,现在我想找到页面的标题并使用它。

现在我确实设法使用正则表达式获取<title>,但是返回标记以及标题本身,我希望从字符串中提取它,或者可以在正则表达式中有这样的方法吗? / p>

这是我的代码:

var title = result.match(/<title[^>]*>([^<]+)<\/title>/);

现在我怎么得到这个/之后的实际标题呢?

7 个答案:

答案 0 :(得分:12)

.match()返回匹配数组,使用

var title = result.match(/<title[^>]*>([^<]+)<\/title>/)[1];

获取括号中的值

答案 1 :(得分:9)

将响应html字符串加载到类似的jQuery对象中并检索文本

$(response).find("title").text();

答案 2 :(得分:3)

一种相对简单的普通JavaScript和非正则表达式方法:

var htmlString = '<head><title>Some title</title></head><body><p>Some text, in a paragraph!</p></body>',
    html = document.createElement('html'),
    frag = document.createDocumentFragment();
html.innerHTML = htmlString;
frag.appendChild(html);

var titleText = frag.firstChild.getElementsByTagName('title')[0].textContent || frag.firstChild.getElementsByTagName('title')[0].innerText;

console.log(titleText);​

JS Fiddle demo

显然,我必须猜测您的HTML字符串,并从内容周围删除(假设存在的)封闭<html> / </html>标记。但是,即使这些标记位于字符串中,它仍然有效:JS Fiddle demo

一种稍微更具功能性的方法:

function textFromHTMLString(html, target) {
    if (!html || !target) {
        return false;
    }
    else {
        var fragment = document.createDocumentFragment(),
            container = document.createElement('div');
        container.innerHTML = html;
        fragment.appendChild(container);
        var targets = fragment.firstChild.getElementsByTagName(target),
            result = [];

        for (var i = 0, len = targets.length; i<len; i++) {
            result.push(targets[i].textContent || targets[i].innerText);
        }
        return result;        
    }
}

var htmlString = '<html><head><title>Some title</title></head><body><p>Some text, in a paragraph!</p></body></html>';

var titleText = textFromHTMLString(htmlString, 'title');

console.log(titleText);​

JS Fiddle demo

答案 3 :(得分:2)

<强> CODE:

var title = result.match("<title>(.*?)</title>")[1];

答案 4 :(得分:0)

使reg exp不区分大小写。 这是完整的代码:

var regex = /<title>(.*?)<\/title>/gi; 
var input = "<html><head><title>Hello World</title></head>...</html>";
if(regex.test(input)) {
  var matches = input.match(regex);
  for(var match in matches) {
    alert(matches[match]);
  } 
} else {
  alert("No matches found!");
}

答案 5 :(得分:0)

尝试一下,我认为这会有所帮助。就我而言,它非常有效。 :)

 var FindTag=(data='',tag='')=>{
    var div=document.createElement('div');
    div.innerHTML=data;
    data=$(div).find(tag)[0].outerHTML;
    return data;
 }

var data=FindTag(data,"title");

答案 6 :(得分:0)

正则表达式不是在 HTML 中查找内容的好方法,这对于简单的一次性正则表达式来说太复杂了。 (请参阅有关此主题的 famous post。)而是使用 DOMParserparseFromString,然后查看生成的文档:

const html = "<!doctype html><head><title>example</title>";

const parser = new DOMParser();
const doc = parser.parseFromString(html, "text/html");
const title = doc.querySelector("title");
console.log(title.textContent);