使用javascript从外部页面获取html元素

时间:2017-04-25 22:29:12

标签: javascript jquery html ajax

我试图在javascript中创建一个函数,它将创建一个视频html元素,并通过从另一个网页中检索源元素来获取源代码

我已经使用jquery或一些ajax的东西看到了其他问题的答案,但是没有人真正解释自己,所以我所能做的就是将他们说的任何内容复制并粘贴到我的页面中并得到错误说" $"未定义(如果你不能告诉我,我对javascript很新。还没有使用任何ajax或jquery)。

function loadSource(url){
    var vid = document.getElementById("vid");
    var src = <get source element with id "mp4Source" from the specified url>
    vid.appendChild(src);
}

1 个答案:

答案 0 :(得分:4)

您未定义$的原因是因为您尚未添加JQuery库。

有一个很好的问题解释如何获得设置here

在JavaScript之上,您需要包含JQuery库。

如何包含JQuery库的示例

<script type="text/javascript" src="http://code.jquery.com/jquery-latest.min.js"></script>

至于加载外部视频元素,您需要向包含该元素的URL发出AJAX请求。 AJAX是一种执行异步HTTP请求的方法,例如,在不刷新网页的情况下对URL进行的请求。

如何使用AJAX从外部网址提取HTML的示例

function loadSource(url){
    $.ajax({
        url: "<URL containing the HTML>",
    })
    .done(function(html) {
        $("#vid").append(html); // append the html to the element with the ID 'vid'
    });
}

有关AJAX的更多信息,请访问http://api.jquery.com/jquery.ajax/

您还应该查看JQuery的基础知识,例如查看here。如何在您的代码中使用此示例的示例是将document.getElementById("vid")替换为$("#vid")