Question

如何编写JS函数来删除单击时的跨度并保留内部文本？

    <span class="test" onclick="removespan(this);">Data in red</span>

    removespan = function(e){
                            alert(e.innerText);
                            }
    CSS : span.test{color:red;}

onclick我想删除跨度并保留内部文本。事实上，我希望有一个onmodify事件...删除跨度。目的是在WYSIWYG编辑器中删除拼写检查器span类。

Answer 1

如果span是其父节点中唯一的子元素

<div>
    <span class="test" onclick="removespan(this);">Data in red</span>
</div>


removespan = function(span) {
    span.parentNode.innerHTML = span.innerHTML;
}

否则使用此功能

removespan = function(span) {
    span.parentNode.replaceChild(document.createTextNode(span.innerHTML), span);
}

Answer 2

如果有人对二极管的第二个选项的“扩展”版本感兴趣：

function removespan(span) {
    // Get the text contents of the clicked span
    var span_contents = span.innerHTML;
    // Get the parent node of the clicked span
    var span_parent = span.parentNode;
    // Create a new text node in the DOM to hold the text contents
    var text_node = document.createTextNode(span.innerHTML);
    // Replace the clicked span node with your newly created text node
    span_parent.replaceChild(text_node, span);

    // Alternatively, do the above in one line...
    // span.parentNode.replaceChild(document.createTextNode(span.innerHTML), span);
}

Answer 3

<span id="test"></span>

y=doc.getElementsById("test");

y.getParent().removeChild(y);

如何删除span onclick或on modify？

3 个答案: