Maison interface Web tutoriel HTML JavaScript implémente l'obtention du code HTML distant vers la page actuelle

JavaScript implémente l'obtention du code HTML distant vers la page actuelle

Jun 05, 2018 pm 02:35 PM
javascript

Aujourd'hui, je travaille sur un projet et j'ai besoin de référencer une page html distante dans la page html actuelle. J'ai cherché sur Baidu et j'ai trouvé un code très utile. Je le partagerai avec vous ici. peut jeter un oeil

code html

<p id="includeHtml"></p>
Copier après la connexion

code 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
Copier après la connexion

L'utilisation est très simple, et le code a été commenté Voici une brève description pour ceux qui ne lisent pas les commentaires

Recommandations associées :

Une brève discussion sur l'échappement HTML et les méthodes pour empêcher les attaques par injection Javascript

Ce qui précède est le contenu détaillé de. pour plus d'informations, suivez d'autres articles connexes sur le site Web de PHP en chinois!

Déclaration de ce site Web
Le contenu de cet article est volontairement contribué par les internautes et les droits d'auteur appartiennent à l'auteur original. Ce site n'assume aucune responsabilité légale correspondante. Si vous trouvez un contenu suspecté de plagiat ou de contrefaçon, veuillez contacter admin@php.cn

Article chaud

Repo: Comment relancer ses coéquipiers
3 Il y a quelques semaines By 尊渡假赌尊渡假赌尊渡假赌
R.E.P.O. Crystals d'énergie expliqués et ce qu'ils font (cristal jaune)
1 Il y a quelques semaines By 尊渡假赌尊渡假赌尊渡假赌
Hello Kitty Island Adventure: Comment obtenir des graines géantes
3 Il y a quelques semaines By 尊渡假赌尊渡假赌尊渡假赌
Combien de temps faut-il pour battre Split Fiction?
3 Il y a quelques semaines By DDD

Article chaud

Repo: Comment relancer ses coéquipiers
3 Il y a quelques semaines By 尊渡假赌尊渡假赌尊渡假赌
R.E.P.O. Crystals d'énergie expliqués et ce qu'ils font (cristal jaune)
1 Il y a quelques semaines By 尊渡假赌尊渡假赌尊渡假赌
Hello Kitty Island Adventure: Comment obtenir des graines géantes
3 Il y a quelques semaines By 尊渡假赌尊渡假赌尊渡假赌
Combien de temps faut-il pour battre Split Fiction?
3 Il y a quelques semaines By DDD

Tags d'article chaud

Bloc-notes++7.3.1

Bloc-notes++7.3.1

Éditeur de code facile à utiliser et gratuit

SublimeText3 version chinoise

SublimeText3 version chinoise

Version chinoise, très simple à utiliser

Envoyer Studio 13.0.1

Envoyer Studio 13.0.1

Puissant environnement de développement intégré PHP

Dreamweaver CS6

Dreamweaver CS6

Outils de développement Web visuel

SublimeText3 version Mac

SublimeText3 version Mac

Logiciel d'édition de code au niveau de Dieu (SublimeText3)

Comment mettre en œuvre un système de reconnaissance vocale en ligne à l'aide de WebSocket et JavaScript Comment mettre en œuvre un système de reconnaissance vocale en ligne à l'aide de WebSocket et JavaScript Dec 17, 2023 pm 02:54 PM

Comment mettre en œuvre un système de reconnaissance vocale en ligne à l'aide de WebSocket et JavaScript

WebSocket et JavaScript : technologies clés pour mettre en œuvre des systèmes de surveillance en temps réel WebSocket et JavaScript : technologies clés pour mettre en œuvre des systèmes de surveillance en temps réel Dec 17, 2023 pm 05:30 PM

WebSocket et JavaScript : technologies clés pour mettre en œuvre des systèmes de surveillance en temps réel

Comment mettre en œuvre un système de réservation en ligne à l'aide de WebSocket et JavaScript Comment mettre en œuvre un système de réservation en ligne à l'aide de WebSocket et JavaScript Dec 17, 2023 am 09:39 AM

Comment mettre en œuvre un système de réservation en ligne à l'aide de WebSocket et JavaScript

Comment utiliser JavaScript et WebSocket pour mettre en œuvre un système de commande en ligne en temps réel Comment utiliser JavaScript et WebSocket pour mettre en œuvre un système de commande en ligne en temps réel Dec 17, 2023 pm 12:09 PM

Comment utiliser JavaScript et WebSocket pour mettre en œuvre un système de commande en ligne en temps réel

Tutoriel JavaScript simple : Comment obtenir le code d'état HTTP Tutoriel JavaScript simple : Comment obtenir le code d'état HTTP Jan 05, 2024 pm 06:08 PM

Tutoriel JavaScript simple : Comment obtenir le code d'état HTTP

JavaScript et WebSocket : créer un système efficace de prévisions météorologiques en temps réel JavaScript et WebSocket : créer un système efficace de prévisions météorologiques en temps réel Dec 17, 2023 pm 05:13 PM

JavaScript et WebSocket : créer un système efficace de prévisions météorologiques en temps réel

Comment utiliser insertBefore en javascript Comment utiliser insertBefore en javascript Nov 24, 2023 am 11:56 AM

Comment utiliser insertBefore en javascript

Comment obtenir facilement le code d'état HTTP en JavaScript Comment obtenir facilement le code d'état HTTP en JavaScript Jan 05, 2024 pm 01:37 PM

Comment obtenir facilement le code d'état HTTP en JavaScript

See all articles