1

정적으로 제공된 HTML 파일 (즉, index.html이 아닌 페이지 자체)에 스크립트 태그를 삽입 할 수있는 Chrome 확장 프로그램을 만들고 싶습니다.크롬 확장 프로그램을 사용하여 정적 HTML 저작물에 액세스하고 변경할 수 있습니까?

내 매니페스트에두고 콘텐츠 스크립트로 메인 실제 페이지 (. 즉 index.html)에이 작업을 수행 할 수 있어요

:

... 
"content_scripts": [ 
    { 
    "js": ["script.js"], 
    "run_at": "document_start" 
    } 
], 
... 

... 그리고 script.js에서 document.body.insertAdjacentHTML('afterbegin', '[SCRIPT_PATH]');,하지만 것 저는 자산으로 제공되는 다른 HTML 파일에서이 작업을 수행하고 있습니다. BTW는 내 주 index.html에서 웹 구성 요소로 가져옵니다.

즉, 콘텐트 스크립트는 소스 파일 (메인 index.html 제외)로 제공되는 정적 HTML 파일에 액세스 (및 수정/변경) 할 수 있습니까?

감사합니다.

편집는 :

<script src="bar.js"></script> 
<!-- here I want the Chrome extension's content script to inject another script --> 

답변

1

당신은 import로 가져온 문서에 액세스 할 수 있습니다

된 index.html 내용 :

<!DOCTYPE html> 
<html> 
<head> 
    <title>Yay!</title> 
    <link rel="import" href="foo.html"> 
</head> 
<body> 
    Sexy body woop! 
</body> 
</html> 

foo.html을 내용 그래서 여기 내 구조입니다 속성은 <link> 요소의 메인 하나 할 것 같은

var link = document.querySelector('link[href="foo.html"]') 
var importedDoc = link.import 

는 그런 다음 가져온 HTML 문서를 조작 할 수 있습니다 :

//get the bar.js script element 
var script = importedDoc.querySelector('script[src="bar.js"]') 
//append your script after it 
importedDoc.body.insertBefore(yourScript, script.nextSibling)