使用 JavaScript 解析 <title> 标签中的内容

Parse content from <title> tag with JavaScript

本文关键字:标签 title JavaScript 解析 使用      更新时间:2023-09-26

我的页面看起来像这样

<head>
<title>story : cat</title>

有时标题也看起来像story | cat.此标题在锚标记中捕获。

<a class="results" heref="www.hello.com" title="story : cat"/> 
<a class="results" heref="www.hello.com" title="story | cat"/>

如何仅使用 javascript 截断锚标记内的标题值以仅捕获故事-

<a class="results" heref="www.hello.com" title="story"/>

在分隔符上拆分(使用简单的正则表达式在:|上拆分(,然后选择第一部分(并trim()它以删除多余的空格(,假设只有两个部分,如果有更多,则只有第一个是感兴趣的:

"story : cat".split(/[:|]/)[0].trim() //=> 'story'
"story | cat".split(/[:|]/)[0].trim() //=> 'story'
"dog : cat".split(/[:|]/)[0].trim() //=> 'dog'
"story : chapter : cat".split(/[:|]/)[0].trim() //=> 'story'

也适用于多单词的第一部分和标点符号,而不是:|

"once upon a story : cat".split(/[:|]/)[0].trim() //=> 'once upon a story'
"hey! a story? : cat".split(/[:|]/)[0].trim() //=> 'hey! a story?'
"ß—¯±× : cat".split(/[:|]/)[0].trim() //=> 'ß—¯±×'
"物語 : 猫".split(/[:|]/)[0].trim() //=> '物語'

以下是一些具有潜在问题输入的示例,用于评估此答案的有效性。

如果标题为空或不包含:|

"".split(/[:|]/)[0].trim() //=> ''
"foo bar".split(/[:|]/)[0].trim() => 'foo bar'

如果标题包含(任意数量的(:

":".split(/[:|]/)[0].trim() //=> ''
":::".split(/[:|]/)[0].trim() //=> ''
"|".split(/[:|]/)[0].trim() //=> ''
"|||||".split(/[:|]/)[0].trim() //=> ''
" : : : ".split(/[:|]/)[0].trim() //=> ''
" : | : | : ".split(/[:|]/)[0].trim() //=> ''
":|:|:".split(/[:|]/)[0].trim() //=> ''

与其他答案相比:

子字符串(0, 5(

"story : cat" -> "story"
"story | cat" -> "story"
"dog : cat" -> "dog :"
"story : chapter : cat" -> "story"
"once upon a story : cat" -> "once "
"hey! a story? : cat" -> "hey! "
"ß—¯±× : cat" -> "ß—¯±×"
"物語 : 猫" -> "物語 : "
"" -> ""
"foo bar" -> "foo b"
":" -> ":"
":::" -> ":::"
"|" -> "|"
"|||||" -> "|||||"
" : : : " -> " : : "
" : | : | : " -> " : | "
":|:|:" -> ":|:|:"

/^''w+/使用 .match()

"story : cat" -> "story"
"story | cat" -> "story"
"dog : cat" -> "dog"
"story : chapter : cat" -> "story"
"once upon a story : cat" -> "once"
"hey! a story? : cat" -> "hey"
"ß—¯±× : cat" -> ""
"物語 : 猫" -> ""
"" -> ""
"foo bar" -> "foo"
":" -> ""
":::" -> ""
"|" -> ""
"|||||" -> ""
" : : : " -> ""
" : | : | : " -> ""
":|:|:" -> ""

/^''w+/使用 .replace()

"story : cat" -> "story"
"story | cat" -> "story"
"dog : cat" -> "dog"
"story : chapter : cat" -> "story"
"once upon a story : cat" -> "once"
"hey! a story? : cat" -> "hey"
"ß—¯±× : cat" -> "ß—¯±× : cat"
"物語 : 猫" -> "物語 : 猫"
"" -> ""
"foo bar" -> "foo"
":" -> ":"
":::" -> ":::"
"|" -> "|"
"|||||" -> "|||||"
" : : : " -> " : : : "
" : | : | : " -> " : | : | : "
":|:|:" -> ":|:|:"

substring(.indexOf(':'( + 1(

"story : cat" -> " cat"
"story | cat" -> "story | cat"
"dog : cat" -> " cat"
"story : chapter : cat" -> " chapter : cat"
"once upon a story : cat" -> " cat"
"hey! a story? : cat" -> " cat"
"ß—¯±× : cat" -> " cat"
"物語 : 猫" -> " 猫"
"" -> ""
"foo bar" -> "foo bar"
":" -> ""
":::" -> "::"
"|" -> "|"
"|||||" -> "|||||"
" : : : " -> " : : "
" : | : | : " -> " | : | : "
":|:|:" -> "|:|:"

拆分和 .pop((

功能上等同于我的,除了没有.trim().

"story : cat" -> " cat"
"story | cat" -> " cat"
"dog : cat" -> " cat"
"story : chapter : cat" -> " cat"
"once upon a story : cat" -> " cat"
"hey! a story? : cat" -> " cat"
"ß—¯±× : cat" -> " cat"
"物語 : 猫" -> " 猫"
"" -> ""
"foo bar" -> "foo bar"
":" -> ""
":::" -> ""
"|" -> ""
"|||||" -> ""
" : : : " -> " "
" : | : | : " -> " "
":|:|:" -> ""

基于这篇文章中的答案 如何在 javascript 中删除 ":" 之前的部分字符串?

您可以轻松使用以下方法之一:

var str = document.getElementsByClassName('results')[0].getAttribute("title"); //Use loop for other indexes 
str = str.substring(str.indexOf(":") + 1);

var str = document.getElementsByClassName('results')[0].getAttribute("title"); //Use loop for other indexes
str = str.split(":").pop();

此解决方案更具可伸缩性,因为您不会对冒号或 | 字符所在的索引进行硬编码。您可以使用函数来查找它,以便稍后可以更改关键字,它仍然有效。

您可以尝试使用子字符串方法。将标题传递到 var 中,然后将其子字符串化。

var str = "故事:猫";

var res = str.substring(0, 5(;

您可以使用以下命令获取页面标题:

document.title;

您可以使用以下命令获取标题的第一个单词:

var titleFirstWord = document.title.replace(/(^'w+).*/,'$1');

我不知道您想如何获取对链接的引用,但是一旦完成此操作,您就可以使用:

linkRef.title = titleFirstWord.

下面是一个示例。将鼠标悬停在链接上以查看标题的设置。

  
    var titleFirstWord = document.title.replace(/(^'w+).*/,'$1');
    document.links[0].title = titleFirstWord;
<head>
  <title>story : cat</title>
</head>
<a href="http://www.foo.com" title="whatever">whatever</a>  
  

尝试使用带有RegExp /^'w+/String.prototype.match()来匹配document.title开头的 0 个或多个单词字符;还可以在元素ahref 代替 heref

document.querySelector(".results")
.setAttribute("title", document.title.match(/^'w+/))
<head>
<title>story : cat</title>
  </head>
<a class="results" href="www.hello.com" title="">title</a>

你可以这样做:

var results = documet.getElementsByTagName("results")[0].getAttribute("title");
var str = results.substring(0,5);
var str2 = results.slice(0,5);
相关文章: