首页 > PHP资讯 > HTML5培训技术 > JavaScript实现获取远程的html到当前页面中的示例代码分享

JavaScript实现获取远程的html到当前页面中的示例代码分享

HTML5培训技术
今天做个项目,需要在当前的html页面中引用一个远程的html页面,百度了一下,发现一个非常好用的代码,这里分享给大家,有相同需求的小伙伴可以来看看

html代码

javascript代码

function clientSideInclude(id, url) {  var req = false;  // Safari, Firefox, 及其他非微软浏览器  if (window.XMLHttpRequest) {    try {      req = new XMLHttpRequest();    } catch (e) {      req = false;    }  } else if (window.ActiveXObject) {    // For Internet Explorer on Windows    try {      req = new ActiveXObject("Msxml2.XMLHTTP");    } catch (e) {      try {        req = new ActiveXObject("Microsoft.XMLHTTP");      } catch (e) {        req = false;      }    }  }  var element = document.getElementById(id);  if (!element) {    alert("函数clientSideInclude无法找到id " + id + "。" +      "你的网页中必须有一个含有这个id的p 或 span 标签。");    return;  }  if (req) {    // 同步请求,等待收到全部内容    req.open('GET', url, false);    req.send(null);    if (req.status == 404) {      clientSideInclude(id, 'error.html')    } else {      element.innerHTML = req.responseText;    }  } else {    element.innerHTML =      "对不起,你的浏览器不支持" +      "XMLHTTPRequest 对象。这个网页的显示要求" +      "Internet Explorer 5 以上版本, " +      "或 Firefox 或 Safari 浏览器,也可能会有其他可兼容的浏览器存在。";  }}clientSideInclude(includeHtml, "http://XXXXX.html");//页面中的一个p的id为includeHtml

用法很简单,代码里已经注释了,这里在简单描述下,给那些不看注释的人看吧

js代码在当前页面加载或者做成js文件加载进来,然后远端的代码会自动写入到当前页面里id号为 includehtml的p里面

以上就是JavaScript实现获取远程的html到当前页面中的示例代码分享的详细内容,更多请关注 第一PHP社区 其它相关文章!

HTML5培训技术

本文由欣才IT学院整理发布,未经许可,禁止转载。
支持41不支持0