HTML 가져 오기 파일에서 localStorage에 저장

Question

웹 사이트에 콘텐츠를 동적으로 삽입하는 수단으로 HTML 가져 오기를 사용하고 있습니다. 그것은 완벽하게 작동합니다. article 은 파일과 템플릿 모두에 대한 가져 오기 사용을 제공합니다.

실제로 다른 기사는 거의 없지만 Bidelman 's가 가장 광범위합니다. 그것은 수입에서 스크립팅을 다루고 있습니다. 그러나 가져온 내용을 렌더링 할 수 있고 스크립트를 실행할 수 있기 때문에 로컬 저장소에 데이터를 저장할 수 없습니다.

경고와 같이 가져 오기 파일에서 가져온 파일의 스크립트를 실행할 수 있습니다. 그러나 저장하고 저장해야하는 데이터를 잡는 것은 불가능합니다. 어떻게이 일을 성취 할 수 있습니까? 다음은 내 코드 샘플입니다.

나는 dim_city가 id 인 간단한 select를가집니다. , 하나의 파일로

var ie = importDoc.querySelector('#dim_city'); // capture the selector value. 
    function getData() { 
    var idc=ie.options[ie.selectedIndex].value; 
    var dataCi=(idc); 
    localStorage.setItem("ic", dataCi); 
    var storedData = localStorage.getItem(dataCi); 

    mainDoc.body.appendChild(dataCi.cloneNode(true)); // this adds tha captured data to importer file. 
}  

그것은 로컬 스토리지에 잘 저장 데이터를 실행 : 로컬 스토리지에 변화와 저장소의 값을 캡처하는 스크립트는 매우 간단합니다. 가져온 경우 경고와 같은 스크립트를 실행하지만 localStorage에는 저장할 수 없습니다.

분명히 브라우저가 HTML 가져 오기를 지원하고 있습니다.

Answer 1

definition에 따르면 가져 오기에는 browsing context이 없으므로 localStorage이 없습니다.

http://w3c.github.io/webcomponents/spec/imports/#terminology

Answer 2

내가 솔루션, 그래, 가져온 파일은 로컬 스토리지에 데이터를 저장한다 발견했습니다. 그래서 저는 스스로 대답 할 것입니다 :

문제는 선택자의 속성 옵션에서 값을 가져 오는 중입니다. 이 방법은 오래된 방법이며 가져올 때 Chrome에서 충돌하는 것으로 보입니다.

var idc=ie.options[ie.selectedIndex].value; 

사용이 : 그래서 솔루션이 대신 선택한 값을 얻을 것입니다

var idc=docuemnt.getElementById('dim_city').value; 

한편을, 내가 그것을 어떤 가져온 파일의 DOM이 일부가 아닌 것은 사실이다 명확히하자 수입업자 DOM의 경우, 자신의 DOM과 마스터 수입업자의 DOM을 모두 액세스 할 수 있습니다. DOM을 참조하고 마스터에 DOM을 추가합니다.