javascript - Chrome extension planting an image in the current document - Stack Overflow

admin管理员组

文章数量:1321603

I'm trying to write a Chrome extension that as a part of what it's doing needs to add an image to the currently displayed html. I guess I need to use document.createElement and then insert it somewhere, but I'm not sure about two things:

1. The image es as part of the extension, i.e. there's no direct link to it anywhere, so simply adding an img tag won't work. Unless I'm missing something.

2. Not Chrome-related at all: what is the best way to add the img tag to a specific location if the html elements do NOT have any id's? I can find the place I want to add the img to using regexps, and can rewrite the whole html if needed, but maybe there's a more subtle way I'm missing.

I'm trying to write a Chrome extension that as a part of what it's doing needs to add an image to the currently displayed html. I guess I need to use document.createElement and then insert it somewhere, but I'm not sure about two things:

1. The image es as part of the extension, i.e. there's no direct link to it anywhere, so simply adding an img tag won't work. Unless I'm missing something.

2. Not Chrome-related at all: what is the best way to add the img tag to a specific location if the html elements do NOT have any id's? I can find the place I want to add the img to using regexps, and can rewrite the whole html if needed, but maybe there's a more subtle way I'm missing.

• javascript
• google-chrome-extension

Share Improve this question Follow edited Feb 11, 2011 at 14:31 Andy E 345k8686 gold badges481481 silver badges451451 bronze badges asked Feb 11, 2011 at 14:28 Gadi AGadi A 3,53988 gold badges3939 silver badges5555 bronze badges

Add a ment  | 

1 Answer 1

Sorted by: Reset to default 11

You can get image url from your extension folder by running:

var imgUrl = chrome.extension.getURL("image.png");

(it would look like this: chrome-extension://<extension_id>/image.png)

If you're using manifest-version: 2 you'll need to whitelist any resource in your extension that you inject into other documents. See this question for more info.

As to your second question - you need to provide more details. Does it have class? Do you know inside what tag is it (li, div)? You probably would be better off using jQuery for this - it has lots of pretty advanced selectors. I don't know what search criteria are you trying to use exactly so I can't suggest a concrete solution.

本文标签： javascriptChrome extension planting an image in the current documentStack Overflow