Question

我有两个html文件名为 index.html ＆amp;的 video.html

video.html 包含如下代码：

<div id="video">
<iframe src="http://www.youtube.com/embed/tJFUqjsBGU4?html5=1" width=500 height=500></iframe>
</div>

我希望从index.html

中的video.html页面抓取上述代码

我不能使用任何后端编码，如php或.net

有没有办法使用Ajax？

Answer 1

当然，发送一个ajax电话。

$.ajax({
url: 'video.html',
success: function(data) {
    data=$(data).find('div#video');
   //do something

 }
});

Answer 2

是的，这是ajax的完美用例。当您向video.html页面发出$.ajax()请求时，您可以将响应视为与您处理现有DOM的方式类似。

例如，您可以通过以下方式指定URI来启动请求：

$.ajax({
    url: 'video.html'
})

您希望确保请求成功。幸运的是，jQuery将使用.done回调函数来处理这个问题：

$.ajax({
  url: "video.html",
}).done(function ( data ) {});

现在只需要以类似于使用任何其他jQuery对象的方式使用data对象。我推荐使用.find()方法。

$.ajax({
  url: "video.html",
}).done(function ( data ) {

    $(data).find('#video'));
  }
});

Answer 3

由于您提到了抓取，我认为可能存在多个页面。以下内容从url数组加载页面，并将成功加载存储到结果中。它会在每次加载时减少remainingUrls（可能对更新进度条很有用）（complete或success之后调用error），并且可以在处理完所有页面后调用方法{ {1}}。

如果这是过度杀伤，只需使用(!remainingUrls)部分，然后将$.ajax替换为myUrls[i]。我仅指定video.html，因为我遇到了另一个脚本将默认类型的ajax更改为POST的情况。如果您正在加载像php或aspx这样的动态页面，那么如果您要在每个会话中多次调用此属性，那么type属性也可能会有所帮助。

cache

Answer 4

试试这个......

$.ajax({
url: 'video.html',
success: function(data) {
    mitem=$(data).filter('#video');
    $(selector).html(mitem); //then put the video element into an html selector that is on your page.
 }
});

Answer 5

未经测试，但应与此类似：https://stackoverflow.com/a/3535356/1059828

var xhr= new XMLHttpRequest();
xhr.open('GET', 'index.html', true);
xhr.onreadystatechange= function() {
    if (this.readyState!==4) return;
    if (this.status!==200) return; // or whatever error handling you want
    document.getElementsByTagName('html').innerHTML= this.responseText;
};
xhr.send();

如何通过ajax从html文件中获取特定的div id

5 个答案: