0
votes

Fetch HTML et insérer dans DOM, mais analyse par rapport à un chemin spécifique

Disons que j'ai ce fragment HTML à /path/fragment.html code>: xxx pré>

Je peux récupérer ce fichier et insérer-le dans le DOM facilement:

const dom = document.getElementById('root');
const response = await fetch('/path/fragment.html');
const fragment = await response.text();
dom.innerHTML = fragment;


2 commentaires

Êtes-vous ouvert pour insérer le code HTML récupéré dans un iframe? Ensuite, vous pourriez probablement mettre sa base href et accomplir ce que vous essayez de faire


J'ai essayé un iframe. Cela fonctionne comme prévu mais n'hérite pas à la CSS du parent, etc. Je devrais travailler avec manuellement ces types de problèmes. Je ferai cela si je dois mais je voulais vérifier d'abord des alternatives plus élégantes.


3 Réponses :


1
votes
  1. Vous pouvez aller à la route rapide et sale: dom.innerhtml = fragment.replace ('src = \' ./ ',' src = \ './ chemin /');

  2. ou après l'insertion du code HTML, vous pouvez boucler via des éléments et mettre à jour la source.

  3. Vous pouvez également utiliser un

    Articles qui pourrait vous intéresser :

    Impossible d'importer le module "@ angular / material"
    Interaction profonde avec break and catch
    Utilisation de node.js comment renommer tous les fichiers d'un dossier
    Google Chrome Uncaught (promis) DOMException lors de la lecture AUDIO