1

質問の言い回しがわからないので、コードを投稿して、何をしようとしているのかを説明します。

function getNewElement(tagName, className, idName, text){
    var newElement = document.createElement(tagName);
    newElement.className = className;
    newElement.id = idName;
    newElement.innerHTML = text;

    return newElement;
}

電話したら

getNewElement("div", "meow", "meow1", getNewElement("span","meow", "meow2", "blahblahblah"));

私はただ得る

<div id="meow1" class="meow">[object HTMLSpanElement]</div>

だから私の質問は、変換せずに文字列を返すためにこれをどのように書くのですか(潜在的に高価な操作ですか?)または文字列でゲットーパッチを適用します。

更新:ゲットーパッチバージョン:

function getNewElement(tagName, className, idName, text){
    return '<' + tagName + ' class=' + className + ' id=' + idName + '>' + text + '</' + tagName + '>';     
}

思った機能を実現しましたが、それほどエレガントではない気がします。

4

3 に答える 3

2

確かではありませんが#meow2、新しい要素の内容が必要な#meow1場合は、ステートメントを使用して、これが解決策になります。

function getNewElement(tagName, className, idName, contents){
    var newElement = document.createElement(tagName);
    newElement.className = className;
    newElement.id = idName;
    newElement.innerHTML = 
          typeof contents === 'string' ? contents : contents.innerHTML;
    return newElement;
}

getNewElement("div", "meow", "meow1", 
              getNewElement("span","meow", "meow2", "blahblahblah"));

#meow1新しく作成された要素のコンテンツを使用して、新しい要素を作成します#meow2。ドキュメントのどこかに追加すると、次のようになります。

<div class="meow" id="meow1">blahblahblah</div>

それ以外の場合、#meow2の子になりたい場合は#meow1、これが解決策になります。

function getNewElement(tagName, className, idName, contents){
    var newElement = document.createElement(tagName);
    newElement.className = className;
    newElement.id = idName;
    if (typeof contents === 'string'){
      newElement.innerHTML = contents;
    } else {
      newElement.appendChild(contents);
    }
    return newElement;
}

今あなたがするなら:

document.body.appendChild(
     getNewElement("div", "meow", "meow1", 
                   getNewElement("span","meow", "meow2", "blahblahblah"))
);

これは結果になります:

 <div class="meow" id="meow1">
  <span class="meow" id="meow2">blahblahblah</span>
 </div>
于 2012-04-29T08:37:48.790 に答える
1

の代わりにinnerHTML、を試してくださいappendChild

newElement.appendChild(text);

編集:これはあなたが達成しようとしていることですか?

if(text instanceOf Object) {
    newElement.appendChild(text);
} else {
    newElement.createTextNode(text);
}
于 2012-04-29T08:27:40.967 に答える
0

複数のタイプのパラメーターを受け取るように関数を変更しますtext

function getNewElement(tagName, className, idName, text){
    var newElement = document.createElement(tagName);
    newElement.className = className;
    newElement.id = idName;
    newElement.innerHTML = 
          typeof text === 'string' ? text: text.outerHTML;
    return newElement;
}
于 2012-04-29T09:12:24.777 に答える