javascriptでDOM要素を上書きする

Question

要するに、DOM内の要素を対象にして、後でその要素を変更するためにその場でクラスを挿入しようとしています。

状況は次のとおりです。私は、所定のマークアップ（管理エンジン）を持つアプリケーションで作業しています。これはシステムワークフローのツールであり、チケットのロギング、資産管理のための集中ポータルを作成します。このツールを使用して、エンドユーザーがサービス要求を記録するためのテンプレートを作成します。これは、ウェブインターフェースポータルを介してアクセスされ、これは明らかにマークアップを有する。

これまでのところ、テーブルヘッダーの背景色などの特定のものを変更することができました。私はロード時にそのテンプレート内で起動するルールを作成することでこれを実現します。したがって、本質的には、テンプレートに所定のコードをロードさせてから、ロードした後にforループを適用してコードを変更します。 （ハッキー私は知っている、しかし、本当にうまく働いている）。

私が今実行している問題は、マークアップ内の特定のものは一般的なものです（要素に関連付けられたクラスまたはIDはありません）。私の計画は、特定のジェネリック要素を変数としてターゲットにして、ロード時に自分のクラスを追加することです。クラスを持つ要素を対象とし、その中で子要素をターゲットにし、その子を変数として保存して、その場でjavascriptでクラスを追加する方法はありますか？下記の例をご覧ください。

<tr class=test1> 
    <td> 
    <input> 
    <input> 
    <input> 
    </td> 
<tr/> 

は、だから私は達成しようとしているものを、上記の例で <td>要素にJavaScriptで自分のクラスを追加しています。明らかに、私がターゲットを <td>とすれば、マークアップ内のすべての <td>要素が変更されます。 test1クラスの <tr>親を経由してその特定の <td>に行くことはできますか？ベースコードには触れられないので、現在jqueryリクエストを使用することはできません。

もう一度私はこれが少し後退し、ハッキーですが、私が特に対象とすることができるもの（クラスまたはIDを持つ）で動作することを知っています。私は純粋なJavaScriptでこれを行うことができる必要があります。提案や助けが大変感謝しています。フォーラムで初めて投稿するときに、これがnoobのアプローチか質問であれば謝ります。さらなる例や情報が必要な場合は教えてください。

Answer 1

document.querySelector（「身体」）。子供たちは今、あなたは、アレイ内のあなたの入力を得た身体

Answer 2

var tr = document.getElementsByClassName('test1')[0] 
var td = tr.children[0] 
var inputs = Array.prototype.slice.apply(td.children) 

のすべての子要素を取得することができます。あなたは歓迎です;-)

Answer 3

step1：クラスを選択します。変数t1は、tr要素の配列を含みます。

var t1 = document.querySelector('.test1'); 

STEP2：配列T1から最初の値を取得します。したがって、tr_el1には、1つのtr要素が含まれています。

var tr_el1 = t1[0]; 

STEP3：TRの子を取得します。 td_elには、td要素の配列が含まれています。

var td_el = tr_el1.children; 

は今、あなたはtd_el配列からたくさんの支援のための

Answer 4

感謝をTDを使用することができ、本当に感謝しています。上記の例は、正確ではありませんが私に必要な結果を与えたハイブリッドを構築するのに役立ちました。

var parent = document.querySelector(".roweven").children; 
var nS; 
for (nS = 0; nS < parent.length; nS++) { 

parent[nS].style.position = "absolute"; 
parent[nS].style.width = "100%"; 
} 

私はまだこれを関数にラップしていますが、意図したとおりに動作しています。もう一度ありがとう:)