如何从Chrome扩展程序中查找文本框

Question

I'm making a Chrome extension and I need it to find any form text-boxes on the webpage.

I first tried doing it in my content script like:

document.getElementsByTag("text");

But it always returns undefined so I'm assuming it's searching only my_app.html .

My first question is what function should I use: GetElmentsByTag, by name, by className, or with some other function?

My second question is which JavaScript file do I need to search? Other forums with similar problems said you need to access the DOM in another file like background or popup and then send it to the content script with a message and a listener.

Answer 1

First, you are calling a function that doesn't exist. You probably mean Document.getElementsByTagName() or Document.querySelectorAll() , as you can see here:

 console.log(document.getElementsByTagName); console.log(document.querySelectorAll); console.log(document.getElementsByTag); 

Also, your selector is wrong: There's no <text> HTML element.

If you want all <input> fields, with any type attribute ( text , password , search , radio , checkbox , ...) then you could use any of these:

document.getElementsByTagName('input');

document.querySelectorAll('input');

If you just want <input> s of a specific type, let's say text , you could do:

document.querySelectorAll('input[type="text"]')

Lastly, you can concatenate multiple selectors with , if you want <input> s of different types:

document.querySelectorAll('input[type="text"], input[type="password"]')