如何从一个html文件通过Ajax获取特定的DIV ID

我有两个叫index.html的 & video.html HTML文件如何从一个html文件通过Ajax获取特定的DIV ID

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页面抓取上述代码

我不能使用任何back-如php或.net

有没有办法使用Ajax？

来源

2013-06-21 Vel Murugan S

雅，你可以使用Ajax肯定...让我问你，你尝试过什么？ –

AJAX实际上需要一些“后端”编码;） – abimelex

可以共享代码吗？ –

尝试......

$.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. 
} 
});

来源

2013-06-21 12:59:38 blackhawk

谢谢@Blachawk。我只是添加了$（“＃wrapper”）。html（mitem）来从外部页面获取HTML。 –

欢迎您。乐于帮助。是的，这也是我的意思！这是我的一个忽视。它现在更新。 – blackhawk

当然，发送一个ajax调用。

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

} 
});

来源

2013-06-21 12:47:41

是的，这是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')); 
    } 
});

来源

2013-06-21 12:50:34 imjared

感谢您的一步一步解释 –

没有测试过，但是应该是这东西similair：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();

来源

2013-06-21 12:51:41 abimelex

既然你提到爬，我假设有多个页面的可能性。以下代码从一个url数组中加载页面，并将成功加载存储到结果中。它在每个负载上递减remainingUrls（这对于更新进度条可能很有用）（complete在success或error之后调用），并且可以在处理所有页面后调用方法(!remainingUrls)。

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

var myUrls = ['video1.html', 'video2.html', 'fail.html'], 
     results = [], 
     remainingUrls; 


    $(document).ready(function() { 
     remainingUrls = myUrls.length; 
     for (var i = 0, il = myUrls.length; i < il; i++) { 
      $.ajax({ 
       url: myUrls[i], 
       type: 'get', // somebody might override ajax defaults 
       cache: 'false', // only if you're getting dynamic pages 
       success: function (data) { 
        console.log('success'); 
        results.push(data); 
       }, 
       error: function() { 
        console.log('fail'); 
       }, 
       complete: function() { 
        remainingUrls--; 
        if (!remainingUrls) { 
         // handle completed crawl 
         console.log('done'); 
        } 
       } 
      }); 
     } 
    });

来源

2013-06-21 12:58:21

如何从一个html文件通过Ajax获取特定的DIV ID

回答

相关问题