document.getElementByIdは作成後もnullを返しています

Question

私は既存の要素を取得するために実行しようとしているコードをいくつか持っていますが、開発者コンソールに存在していてもnullを返しています。私は電話をかける前にウィンドウがロードされるまで待つことについていくつかのことを読んだが、これを入れようとしているコードは起動時には実行されず、ユーザのアクションがあるまで待っている。

私も次のことを実行しているし、それはnullを返します。これはnullを返す理由

massText = document.createElement('mass_div'); 
console.log(document.getElementById('mass_div')); 

誰も教えてもらえますか？私は要素を作成したので、なぜそれを得ることができないのですか？私は起動時に最初にそれを作ってみることさえしようとしましたが、それを取得してもまだnullを返します。ここではより多くのコンテキストで

massText.innerHTML = "blah"; 

：私は、既存の要素を編集することができだけではなく、私がやることで、その表示テキストを変更するために、それらを作成しておくのが大好きです。それは、まさにこのようではありません。

//lots of functions that create a model and then call this update method. Called every 500ms 

function updateText() { 
    massText = document.createElement('mass_div'); 
    massText.style.position = 'absolute'; 
    massText.style.width = 100; 
    massText.style.height = 100; 
    massText.style.backgroundColor = "green"; 
    massText.innerHTML = "Mass of the star is " + matches[pos] + " Solar Masses"; 
    massText.style.top = window.innerHeight/10 + 'px'; 
    massText.style.left = window.innerWidth/50 + 'px'; 
    document.body.appendChild(massText); 
} 

これは、要素「mass_div」のコピーのトンを作成

私はこのような何かをすることによってこれらを追加したいと思いますが、それはmassTextが

function updateText() { 
    if (document.getElementById('mass_div') == null){ 
     massText = document.createElement('mass_div'); 
    }else { 
     massText=document.getElementById('mass_div'); 
    } 
    massText.style.position = 'absolute'; 
    massText.style.width = 100; 
    massText.style.height = 100; 
    massText.style.backgroundColor = "green"; 
    massText.innerHTML = "Mass of the star is " + matches[pos] + " Solar Masses"; 
    massText.style.top = window.innerHeight/10 + 'px'; 
    massText.style.left = window.innerWidth/50 + 'px'; 
    document.body.appendChild(massText); 
} 

nullであると言います

あなたは2を持っているあなたのコードで

var massText = document.createElement('div'); 
massText.id='mass_div' 
document.appendChild(massText) 
console.log(document.getElementById('mass_div')); //This is working 

を：あなたが行う必要があり、これが機能するために

Answer 1

問題：

• 機能createElement GET要素nameない要素id。したがって、idを後で追加する必要があります
• 関数getElementByIdは、documentに追加された要素のみを取得します。だから、ここで

Answer 2

は我々が行く前に、文書に要素を追加する必要があります。これは100％に取り組んでいる

var massText = document.createElement('input'); //Here is you create the element input. 
masstext.id ='mass_div';  //Here is you set id for created element input 
document.appendChild(massText); //Added to main document 


console.log(document.getElementById('mass_div')); //handle your element by id and log 

！

Answer 3

一般（これは、Javaであるにかかわらず場合は、javascriptやC＃の）XMLまたはHTML DOMを扱うときのアルゴリズムは同じで簡単です： 1.文字列または同様の文書を作成したり、負荷、 2.無ルートノードの場合 3.子孫ノードを必要に応じて作成します（複数のコンストラクタがあります）。 4.子ノードをルートノード（または別の子ノード）に追加します- あなたの好きなように）。 5. getElementByIdまたはGetElementByTagまたは同様の方法でポイント3で作成したノードを検索することができます。

コードはほとんど貼り付けていませんが、手順4をスキップしたと想定しています。

例では、不足している部分（コンソールの前に配置する必要があります。これはあなたのニーズに合わせ、それが役に立てば幸いすべき

var aaa = doc.createElement("mass_div"); 
doc.appendChild(aaa) 

多かれ少なかれ： のJs：

var aaa = document.createElement("mass_div"); 
document.body.appendChild(aaa); 

のC＃：

var aaa = doc.CreateElement("mass_div"); 
rootNode.AppendChild(aaa); 

のJava（ "AAA"）を記録します。 種類：

P.Sz。