Firebugを使用してCSS属性を検索し、JavaScriptを使用して変更する方法

Question

現在、Greasemonkeyで使用するjsスクリプトを作成して、SOページの上部にある検索ボックスの背景色を永久に変更しようとしています。私はJavascriptの経験はあまりありませんが、Firebugを適切に使用して特定の属性を参照する方法を見つけ出すことができませんでした。

document.getElementById('search').textbox.style.color = '#FFFFAA'; 
document.getElementById('search.textbox').style.color = '#FFFFAA'; 
. 
. 

との組み合わせのリストは上に行くが、私は私のJavascriptの参照との根本的な何かを逃しています図：私は次のことを試してみました。私のGreasemonkeyは、SOのページでalert（）関数が動作するので、間違いなく動作します。ここで

は、HTMLコードの抜粋です：ステップバイ

<div id="topbar"> 
    <div id="hlinks"> 
    <div id="hsearch"> 
     <form id="search" autocomplete="off" method="get" action="/search"> 
      <div> 
       <input class="textbox" type="text" value="" size="28" maxlength="140" tabindex="1" 
       placeholder="search" name="q" autocomplete="off"> 
      </div> 
     </form> 
    </div> 
</div> 

Answer 1

存在しないこのページのIDを検索しているため、スクリプトが機能していません。次のようにSOページのマークアップを調べる

、それが見えます：

<input autocomplete="off" name="q" class="textbox" placeholder="search" tabindex="1" type="text" maxlength="140" size="28" value="" style="width: 200px; max-width: 200px; "> 

そこで我々は、次を使用することができます。

document.getElementsByName('q')[0].style.backgroundColor = 'blue';

Answer 2

使用document.getElementById('search').style.color = '#FFFFAA';

Answer 3

ステップ： var searchForm = document.getElementById('search');

：

1. で検索フォームを取得します。入力テキストボックスを取得する searchBox.style.color = '#FFFFAA';

それとも、ワンステップですべての操作を行うことができます：色を設定し var searchBox = searchForm.q;

：それを使用すると、名前（Q）です
document.getElementById('search').q.style.color = '#FFFFAA';

をしかし、あなたがしたい場合がありますのでご注意ください背景色を変更するには、使用する必要があります：
document.getElementById('search').q.style.backgroundColor= '#FFFFAA';

色が背景色ではなく文字色を変更するため。