Chrome extension inject html to specific div
content-script, google-chrome, google-chrome-extension
Solution
So there is a div with `id="openModal"` to which you want to append the iframe?
iframeInjector.js
var iframe = document.createElement ("iframe");
iframe.src = chrome.extension.getURL ("test.html");
var yourDIV = document.getElementById("openModal");
yourDIV.appendChild(iframe);
Problem
Im trying to make an extension for chrome that injects html code to specific div on a specific page. This is the example page I want to inject some code: http://netdna.webdesignerdepot.com/uploads7/creating-a-modal-window-with-html5-and-css3/demo.html So far I have made this: manifest.json: ``` { "manifest_version": 2, "content_scripts": [ { "js": [ "iframeInjector.js" ], "matches": [ "http://netdna.webdesignerdepot.com/*/*/*" ] } ], "description": "Inject html", "name": "Inject html", "version": "1", "web_accessible_resources": ["test.html"] } ``` test.html: ``` Test html code ``` iframeInjector.js: ``` var iframe = document.createElement ("iframe"); iframe.src = chrome.extension.getURL ("test.html"); document.body.insertBefore (iframe, document.body.openModal); ``` On the example page there is div called "openModal", how do I inject my html code into that div ? Another question: Is there way to read page title to variable and use that variable in my html code which Im infecting ? Thank you..