9

関数ができるだけ早くページにアクセスするのに問題があるので、純粋なJavaScriptで記述して、ヘッドに含める必要があります。私が理解しているように、.replace()を使用すると、新しい要素がページ上の別の場所に移動されるため、どうすればよいかわかりません。jQueryのreplaceWith()の動作は理想的です。

$("#imagefiles").replaceWith("<input type='file' name='imagefiles' id='imagefiles' />");
4

3 に答える 3

8
var image = document.getElementById('imagefiles'), parent = image.parentNode,
tempDiv = document.createElement('div');

tempDiv.innerHTML = "<input type='file' name='imagefiles' id='imagefiles' />"

var input = tempDiv.childNodes[0];

parent.replaceChild(input, image);

デモ


私は午前ではないように編集します:

var image = document.getElementById('imagefiles'), parent = image.parentNode,
input = document.createElement('input');
input.id = input.name = "imagefiles";
input.type = 'file';

parent.replaceChild(input, image);

編集されたデモ

于 2012-04-15T19:28:37.007 に答える
1
  const node = new DOMParser().parseFromString(html, 'text/html').body.childNodes[0];
  document.getElementById(id).replaceWith(node);
于 2021-01-19T03:01:24.013 に答える
0
let element = document.getElementById("imagefiles");
element.insertAdjacentHTML("afterend","<input type='file' name='imagefiles' id='imagefiles' />");
element.parentNode.removeChild(element);

数年後。これでchildNode.replaceWith()がありますが、これはJQuery replaceWith()と厳密には同等ではありません。IEとも互換性がありません

上記のコードは、指定されたHTMLからドキュメントフラグメントを作成し、それをDOMの元の要素の後に挿入してから、元の要素を削除して、効果的に置き換えます。

https://developer.mozilla.org/en-US/docs/Web/API/ChildNode/replaceWith

于 2021-03-16T11:21:56.660 に答える