Удалить дочерний элемент, но сохранить его содержимое

Что является лучшим способом удалить элемент strong во время события onclick?Удалить дочерний элемент, но сохранить его содержимое

<html xmlns="http://www.w3.org/1999/xhtml"> 
<head> 
    <title>Untitled Page</title> 
</head> 
<body> 
    <span onclick="testfx();"><strong>Test without styles</strong></span> 
</body> 
</html> 
<script type="text/javascript"> 
    function testfx() { alert('test'); } 
</script>

источник

2013-07-02 Rod

Если вы хотите удалить только теги (и сохранить текст), вы можете сделать выбор 'span', а затем использовать' execCommand ('removeFormat') '. – Teemu

Просьба предоставить более подробное объяснение вашей проблемы. Если вы хотите удалить элемент 'strong' при сохранении содержимого, посмотрите [мой ответ здесь] (http://stackoverflow.com/questions/16906257/wrap-first-div-of-a-div/16906446 # 16906446). –

Я думаю, что вы должны изменить название для более общего контекста, чтобы люди могли легко найти это. Что-то вроде «Удалить дочерний элемент, но сохраните его содержимое» .. что-то в этом роде. Просто подсказка. – DontVoteMeDown

Вы должны обрабатывать события (javascript) в файле сценария, а не в HTML. Это поможет вам,

Разделение функциональности («поведение слоя») с веб-страницы структуры/содержания и представления
Лучшие практики, чтобы избежать проблем традиционного JavaScript программирования (например, браузер непоследовательность и отсутствие масштабируемости)
Прогрессивного улучшения для поддержки пользовательских агентов, которые могут не поддерживать функциональность расширенного JavaScript

Вы могли бы попробовать это,

var x = document.getElementById("test"); 
var y = document.getElementById("testChild"); 
x.addEventListener('click', function() { 
    this.removeChild(y); 
});

Test Link

EDIT

Если вы просто хотите, чтобы удалить "сильный" эффект этого

var x = document.getElementById("test"); 
var y = document.getElementById("testChild").innerHTML; 
x.addEventListener('click', function() { 
    this.innerHTML = y; 
});

Test Link

источник

2013-07-02 15:16:19

+1 для 3 полезных советов (которые все должны следовать в любом случае) – ChrisW

* «Вы должны обрабатывать события (javascript) в файле сценария« *. Вы имеете в виду файл сценария * или * элемент сценария, правильно? –

@dystroy Я имел в виду, в отдельном файле :) и ссылку на файл. –

Ну, вот это: http://tinker.io/1f282/1

el.addEventListener('click', function() { 
    var toRemove = this.getElementsByTagName('strong')[0]; 

    if (!toRemove) { 
     return; 
    } 

    while (toRemove.firstChild) { 
     el.appendChild(toRemove.firstChild); 
    } 
});

(где el ваш диапазон). Обратите внимание на одну очень важную вещь: вы не должны смешивать javascript в своем html. Это плохо во всех отношениях, вы можете просто «разделить проблемы» и «ненавязчивый javascript», чтобы понять, почему.

источник

2013-07-02 15:36:55

Что делать, если 'toRemove' имеет более одного ребенка или ноль? Может быть 'while (toRemove.firstChild) {el.appendChild (toRemove.firstChild); } '? –

@MikeSamuel Я согласен, что это не общее решение этой проблемы. Я добавлю это, поскольку это полезный случай, спасибо. –

Удалить дочерний элемент, но сохранить его содержимое

ответ

Смежные вопросы