Форум

novitocnaforume · #1 (**permalink**) 15.10.2015, 12:06

Здравствуйте.
Реализация выделения отдельных слов текста предлагает оборачивание в тег span: rng.surroundContents(span);
При удалении: removeChild(); или замене replaceChild(); span удаляется со
своим содержимым.
Как элегантно, не городя лишнего удалить тег span?

EmperioAf · #2 (**permalink**) 15.10.2015, 12:16

display: none;

novitocnaforume · #3 (**permalink**) 15.10.2015, 12:23

Сообщение от EmperioAf

display: none;

span удаляется со своим содержимым: span.style.display = "none";

nerv_ · #4 (**permalink**) 15.10.2015, 12:26

Сообщение от novitocnaforume

При удалении: removeChild(); или замене replaceChild(); span удаляется со
своим содержимым.

вам не кажется это логичным?)

EmperioAf · #5 (**permalink**) 15.10.2015, 12:29

Сообщение от novitocnaforume

span удаляется со своим содержимым: span.style.display = "none";

<!DOCTYPE html>
<html>
<head>
<meta http-equiv="content-type" content="text/html; charset=utf-8" />
<title>ГГ</title>
<style>
.container>span {
   color: red;
}
</style>
</head>
<body>
<div class="container">
  Этот текст  
  <span>как всегда</span>
  ни о чём
</div>
<button>Жми</button>
    <script>
document.querySelector('button').onclick = function(){
  var a = document.querySelector('.container>span');
  var b = getComputedStyle(a).display;
  (b == 'none') ? a.style.display = 'inline' :  a.style.display = 'none';
}
    </script>
</body>
</html>

рони · #6 (**permalink**) 15.10.2015, 12:51

novitocnaforume,
вытащить циклом каждый ~~children~~ childNodes span и вставить перед span потом удалить сам span

novitocnaforume · #7 (**permalink**) 15.10.2015, 12:53

Сообщение от nerv_

вам не кажется это логичным?)

Я привел это как факт

А вопрос: Как элегантно, не городя лишнего удалить тег span?
Выделенный текст заключен в span его удалять ненужно.

novitocnaforume · #8 (**permalink**) 15.10.2015, 12:55

Сообщение от EmperioAf

<!DOCTYPE html>
<html>
<head>
<meta http-equiv="content-type" content="text/html; charset=utf-8" />
<title>ГГ</title>
<style>
.container>span {
   color: red;
}
</style>
</head>
<body>
<div class="container">
  Этот текст  
  <span>как всегда</span>
  ни о чём
</div>
<button>Жми</button>
    <script>
document.querySelector('button').onclick = function(){
  var a = document.querySelector('.container>span');
  var b = getComputedStyle(a).display;
  (b == 'none') ? a.style.display = 'inline' :  a.style.display = 'none';
}
    </script>
</body>
</html>

Выделенный текст заключен в span его удалять ненужно.

рони · #9 (**permalink**) 15.10.2015, 13:02

novitocnaforume,

<!DOCTYPE html>
<html>
<head>
<meta http-equiv="content-type" content="text/html; charset=utf-8" />
<title>ГГ</title>
<style>
.container>span {
   color: red;
}
</style>
</head>
<body>
<div class="container">
  Этот текст
  <span>как всегда</span>
  ни о <span>чём</span>
</div>
<button>Жми</button>
    <script>
document.querySelector("button").onclick = function() {
    [].forEach.call(document.querySelectorAll(".container>span"), function(a) {
        for (var b = a.parentNode, c; c = a.childNodes[0];) b.insertBefore(c, a);
        b.removeChild(a)
    })
};
    </script>
</body>
</html>

novitocnaforume · #10 (**permalink**) 15.10.2015, 13:07

Сообщение от рони

novitocnaforume,
вытащить циклом каждый ~~children~~ childNodes span и вставить перед span потом удалить сам span

Объектах Range имеет много свойств и методов, я думал это можно реализовать элегантно как в примере с оборачиванием в span: rng.surroundContents(span);

Форум

Справочник

Discord чат

Курсы javascript