3

ノード名を置き換えることは可能ですか? お気に入り：

HTML:

<strong id="element">Text</strong>

Javascript:

var element = document.getElementById("element");
    element.nodeName = "b";

機能していないように見えますが、この方法で不可能な場合は、どうすればよいですか?

必要な理由:

私はテキスト エディターを構築しています。IE は execCommand() 関数で b の代わりに strong を使用しています。それを変更したいと思います。execCommand("bold") をゼロから構築しようとしましたが、多くの問題があり、 IE 8 と 9 の間でも違いがあります。そのため、ノード名を変更することにしました。これは非常に簡単ですが、機能しません.. :(

注:これは Internet Explorer でのみ機能する必要があります。

ありがとう

4

5 に答える 5

5

いいえ。ただし、ノードは簡単に交換できます。

var oldNode = document.getElementById('element'),
    newNode = document.createElement('b'),
    node,
    nextNode;

node = oldNode.firstChild;
while (node) {
    nextNode = node.nextSibling;
    newNode.appendChild(node);
    node = nextNode;
}

newNode.className = oldNode.className;
// Do attributes too if you need to
newNode.id = oldNode.id; // (Not invalid, they're not both in the tree at the same time)
oldNode.parentNode.replaceChild(newNode, oldNode);

実際の例

指摘してくれたHaochiに感謝します。私はこれを行いreplaceChildました：

oldNode.parentNode.insertBefore(newNode, oldNode);
oldNode.parentNode.removeChild(oldNode);

ライブの例...しかしreplaceChild、よりクリーンです。

ドキュメント:

于 2011-03-26T17:49:08.363 に答える
3 
Element.prototype.setTagName=function(strTN) {
 var oHTML=this.outerHTML, tempTag=document.createElement(strTN); //document.createElement will fire an error if string has wrong characters.
 var tName={original: this.tagName.toUpperCase(), change: strTN.toUpperCase()}
 if (tName.original == tName.change) return;
 oHTML=oHTML.replace(RegExp("(^\<" + tName.original + ")|(" + tName.original + "\>$)","gi"), function(x){return (x.toUpperCase().replace(tName.original, tName.change));});
 tempTag.innerHTML=oHTML;
 this.parentElement.replaceChild(tempTag.firstChild,this);
}

使用します（ボディの最初の要素のスパンを設定する場合）：

document.body.firstElementChild.setTagName("SPAN");

編集：

何か言い忘れました。新しい要素が作成されるため、元の要素が変数に格納されている場合、変数は古い (変更されていない) 要素を格納します。Element に親 Element がない場合、失敗します。

それが私が新しいものを作った理由です：

Element.prototype.spawn = function(strTN = "spawn") {
 let tName = ({original: this.tagName.toUpperCase(), change: strTN.toUpperCase()}); if (tName.original == tName.change) { return; }
 let fragment = document.createRange().createContextualFragment(this.outerHTML.replace(new RegExp("(^\<\\b" + tName.original + "\\b)|(\\b" + tName.original + "\\b\>$)","gi"), function(x){return(x.toUpperCase().replace(tName.original, tName.change));}));
 return(fragment.firstChild);
}

これは元のすべての子孫を含む新しい Element を作成するだけですが、必要に応じて手動で DOM に配置する必要があります。

var e = document.body.firstElementChild;
e.replaceWith(e.spawn("i"));
于 2015-04-28T17:17:18.450 に答える
1

いいえ、nodeName読み取り専用です。仕様から：

readonly attribute DOMString       nodeName;

ここを参照してください: http://www.w3.org/TR/DOM-Level-3-Core/core.html#ID-1950641247

于 2011-03-26T17:45:28.000 に答える
0

強力な要素の innerHTML 値を一時変数に格納してから、新しい "b" 要素を作成し、その innerHTML を一時変数に格納された値に設定し、最後に強力な要素の親で replaceChild メソッドを使用して、新しい b 要素を持つ強力な要素。

于 2011-03-26T17:49:38.333 に答える