0

このコードを使用して、別の要素の前に新しいコンテンツを追加しようとしています。

 var form = document.getElementsByClassName('commentresponse')[0],
     newcomment = '<div><span></span><span><p class="author">'+author+'</p><p class="content">'+comment+'</p></span></div>' ;
 form.insertBefore(newcomment, form);

2つの変数は正常に機能し、期待どおりの結果を返します。ただし、Chromeでは次のエラーが発生します。Uncaught Error: NOT_FOUND_ERR: DOM Exception 8

どういうわけか、insertBefore行はコードをブロックします。私は何が間違っているのですか？

助けてくれてありがとう！

4

1 に答える 1

2

insertBeforeHTMLではなくDOMノードを取ります。

代わりにこれを行ってください：

var form = document.getElementsByClassName('commentresponse')[0],
    newcomment = document.createElement('div');
newcomment.innerHTML = '<span></span><span><p class="author">'+author+'</p><p class="content">'+comment+'</p></span>';
form.parentNode.insertBefore(newcomment, form);

、、を含む文字列として、エスケープauthorして、を台無しにします。comment'<''>''&'

完全を期すために、DOMノードを使用して完全に実行する方法を次に示します（使用せずにinnerHTML-このようなことを実行することは、現代のWebでは失われた芸術のようですが）。

var form = document.getElementsByClassName('commentresponse')[0],
    newcomment = document.createElement('div'),
    el, el2;
newcomment.appendChild(document.creatElement('span'));
el = document.createElement('span');
el2 = document.createElement('p');
el2.className = 'author';
el2.appendChild(document.createTextNode(author));
el.appendChild(el2);
el2 = document.createElement('p');
el2.className = 'content';
el2.appendChild(document.createTextNode(content));
el.appendChild(el2);
newcomment.appendChild(el);
form.parentNode.insertBefore(el, form);

authorとcontentはテキストノードとして明示的に追加されるため、この方法をエスケープする必要はありません。

于 2012-09-18T03:36:58.070 に答える