Javascript nicht im Schatten ausgeführt DOM

Ich arbeite an einer Anwendung, wo ich andere HTML-Webseiten zur aktuellen Seite laden muss. Andere Webseiten sind unabhängige Anwendungen. Ich versuche, die Webseite im Schatten-DOM zu laden. Dafür habe ich unten Code verwendet, wo versucht wird, test-template.html in shadowRoot zu importieren. Hier verwende ich kein Template-Tag, da ich Template dynamisch rendern muss (mit Ajax).Javascript nicht im Schatten ausgeführt DOM

<head> 
    <script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.1.1/jquery.min.js"></script> 
    </head> 
    <body> 
    <input type="button" onclick="loadTemplate()" value="Load template"> 
    <div id="template-holder"></div> 
    <script> 
    function loadTemplate() { 
     var templateUrl = "test-template.html", 
     templateReceivedCallback = function(response) { 
     var div = document.getElementById('template-holder'), 
      shadowRoot = div.attachShadow({ 
       mode: 'open' 
      }); 
     shadowRoot.innerHTML = response; 
     }; 
    $.get(templateUrl, templateReceivedCallback); 
    } 
    </script> 
</body>

und Test-template.html wird wie folgt aussehen:

<div>Hello from template</div> 

<script> 
    alert("this text is from script inside of template") 
</script>

ich in der Lage bin, die erwähnte Test template.html in meiner aktuellen Seite zu laden, aber Javascript innerhalb der Testvorlage. html wird nicht ausgeführt. Gibt es eine Möglichkeit, das Skript auszuführen? Wenn ja, bitte teilen Sie das laufende Beispiel. Danke.

Quelle

2016-11-22 durgesh.patle

Um die <script> aktiv zu machen, sollten Sie zuerst die geladene Datei in ein <template> Element einfügen. Verwenden Sie dann die importNode()-Methode, die die content der Vorlage klonen und die Skripts ausführen wird.

Statt:

shadowRoot.innerHTML = response;

Do:

var template = document.createElement('template') 
template.innerHTML = response 
shadowRoot.appendChild(document.importNode(template.content, true))

Quelle

2016-11-23 08:04:18 Supersharp

danke für die Antwort, und upvoted Ihre Antwort: p –

Javascript nicht im Schatten ausgeführt DOM

Antwort

Verwandte Themen