Tampermonkey

Question

我正在尝试使用 JavaScript 通过 Tampermonkey 获取一些数据。问题出在正则表达式上，我是在 RegExr（Air 应用程序）中设计的，它似乎在输入文本上运行良好：

<div class="yt-lockup clearfix  yt-lockup-video yt-lockup-grid vve-check" data-context-item-id="Rg2PUqmNWe4" data-visibility-tracking="abc">
  <div class="yt-lockup-dismissable">
      <div class="yt-lockup-thumbnail">
  <span class=" spf-link  ux-thumb-wrap contains-addto"><a href="/watch?v=Rg2PUqmNWe4" class="yt-uix-sessionlink" aria-hidden="true" data-sessionlink="videos">  <span class="video-thumb  yt-thumb yt-thumb-196">
<span class="yt-thumb-default">

但是在代码中它没有显示警报：

var lis = document.getElementById("data").getElementsByTagName("li");
//alert(lis.length);

var item = lis[0].innerHTML;
alert( item.match( /(?<=data-context-item-id=").*?(?=")/g ) );

如何 return 字符串 "Rg2PUqmNWe4"？

Answer 1

Javascript 正则表达式引擎不支持 lookbehind 断言 (?<=...)。
使用以下方法：

alert(item.match(/data-context-item-id="([^"]+)"/)[1]);

([^"]+) - 匹配除 "

之外的所有字符

Answer 2

我认为这是解决这个问题的好办法：

const data = `<div class="yt-lockup clearfix  yt-lockup-video yt-lockup-grid vve-check" data-context-item-id="Rg2PUqmNWe4" data-visibility-tracking="abc">
  <div class="yt-lockup-dismissable">
      <div data-context-item-id="this is also found" class="yt-lockup-thumbnail">
  <span class=" spf-link  ux-thumb-wrap contains-addto"><a href="/watch?v=Rg2PUqmNWe4" class="yt-uix-sessionlink" aria-hidden="true" data-sessionlink="videos">  <span class="video-thumb  yt-thumb yt-thumb-196">
<span class="yt-thumb-default">`

const getData = data => data.match(/data-context-item-id="(.*?)"/g).map(x => x.match(/"(.*?)"/)[1])

console.log(getData(data))

步骤 1
data-context-item-id=" 找到这个部分。
第 2 步
(.*?) 捕获任何东西，直到 "
步骤 3
map 所有找到的答案只获取没有属性名称的数据

此解决方案的优点是可能出现多个属性，如我在示例中所示。

Tampermonkey - 无法使用正则表达式获取数据

Tampermonkey - Cannot get data with Regex

javascript

regex