在开发工具下获取可用元素->资源→帧

Get Element available under Dev Tools -> Resources -> Frames

本文关键字：资源 元素 开发工具 获取      更新时间：2023-09-26

我正试图通过使用Tampermonkey脚本来做到这一点。但是我愿意接受新的方法…

我想做的是从特定的<div>中提取一些数据(data-video)。然而，这些数据在页面的HTML代码下不可用，但它在开发工具->资源和框架下可用。

谁知道是否有可能得到DevTools下可用的信息?我该怎么做呢?

两个页面的比较可以在这里找到:"Original HTML PAGE"answers"HTML PAGE under DevTools"

在第一个超链接上不能看到id=video-canvas，但是它在<object type="application/x-shockwave-flash上(…)

正如您在问题中所述，您正在寻找的数据可在"框架"文件夹中的"资源"选项卡下的DevTools中找到。你现在看到的是源HTML，类似于查看源。

你想要的代码，就是被替换的代码。似乎该网站正在使用JW播放器插件，它正在用检测到播放视频的设备/浏览器的适当HTML替换<div id="video-canvas">。在我的Mac上，我所有的浏览器都被迫使用Flash，即使它被禁用了。当使用我的iPhone时，它不能播放flash，并检查页面，它使用JW自己的自定义视频元素。它似乎必须将文件位置存储在内存中，因为它不在生成的标记中。

我能够在开发工具中运行控制台并访问它们的JS类。看来我可以调用jwplayer._tracker，它有一个对象b。对象b有一个对象AlWv3iHmEeOzwBIxOUCPzg这个对象似乎是一致的，每次我检查不同的浏览器之间，你可以使用我的第一个例子中的for循环来获得正确的值，但将其固定到。b该对象是e，在e是对象http://i.n.jwpltx.com/v1....真的很长的字符串，似乎包含一个url，所以它需要解析。

为了得到HTML字符串，我输入

for ( var loc in jwplayer._tracker.b.AlWv3iHmEeOzwBIxOUCPzg.e){
  loc
}

所以如果我们把它放入一个函数中来解析字符串并返回一个值

function getSubURL(){
  var initURL;
  for ( var loc in  jwplayer._tracker.b.AlWv3iHmEeOzwBIxOUCPzg.e){
    initURL = loc;
  }
  //look for 'mp4:' this is in front of the file path
  var start = initURL.indexOf("mp4%3A");
  //look for the .mp4 for the end of the file name
  var stop = initURL.indexOf(".mp4");
  //grab the string between
  //start+6 to remove characters used to find it 
  //and stop+4 to include characters used to find it
  var subPath = (initURL.substring((start+6),(stop+4))).split("%2F").join("/");
  return subPath;
}
//and run it
getSubURL();

它将返回ciencia/astronomia/fimsol.mp4

你可以从你的控制台运行这个，但我不知道你如何在篡改猴子中使用这个，但我认为它让你更接近你想要的。

这是我用来解决我的问题的方法…我无法在开发工具下获取我想要的代码，但我找到了一种方法，可以使用getPlaylistItem函数从jwplayer获取数据。这就是我获取每个视频的url文件名的方法:

function getFilename(filename) {
    var filename;
    if(jwplayer().getPlaylistItem){
        filename = jwplayer().getPlaylistItem()['file'];
    }
    else{
        return filename;
    }
    filename = filename.substring(filename.indexOf("/mp4:") + 5);
    return filename;
}
相关文章：