Форум

yyyyuriyyyy · #1 (**permalink**) 06.02.2015, 12:41

Здравствуйте. У меня есть такой html:

<div id="a">
 <span>Я</span>
 <span>люблю</span>
 <span>печеньки</span>
</div>
<div id="b"></div>

Когда я кликаю на кнопку, выполняется такой скрипт:

$('div#b').html($('div#a').children('span').text())

У меня возникла такая проблема.
Оно в итоге переносит текст так:

<div id="b">Я люблю печеньки</div>

А как мне сделать, чтобы оно переносило так:

<div id="b">Я
люблю
печеньки</div>

Надеюсь, суть проблемы поняли.)

arcmag · #2 (**permalink**) 06.02.2015, 13:38

Эммм я не совсем понял, если вам надо что бы текст каждого блока спан оказался на новой строке можно вот так вот попробовать сделать

var spans = document.getElementById("a").getElementsByTagName("span");
for(var i=0; i<spans.length; i++){ spans.item(i).style.display = "block";}

Sweet · #3 (**permalink**) 06.02.2015, 13:41

А какая разница? Отображается одинаково:

<div id="b">Я люблю печеньки</div>
<div id="b">Я
люблю
печеньки</div>

"Врапни" текст в дивы. Т.е. замени <span> на <div>.

arcmag · #4 (**permalink**) 06.02.2015, 13:46

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

А какая разница? Отображается одинаково:

<div id="b">Я люблю печеньки</div>
<div id="b">Я
люблю
печеньки</div>

"Врапни" текст в дивы. Т.е. замени <span> на <div>.

ну может человек не ищет легких путей...

ruslan_mart · #5 (**permalink**) 06.02.2015, 13:54

arcmag, если так, то лучше уж через CSS:

#b span {
    display: block;
}

Deff · #6 (**permalink**) 06.02.2015, 17:07

Тег <pre> Позволяет выводить текст как задано изначально

freee · #7 (**permalink**) 06.02.2015, 17:36

<html>
<head>
</head>
<body>


<div id="a">
 <span>Я</span>
 <span>люблю</span>
 <span>печеньки</span>
</div>
<div id="b"></div>
<button id="c">push</button>


<script>
$=document.querySelector.bind(document)

$("#c").onclick=function(){
 $("#b").innerHTML=$("#a").innerHTML
  .replace(/[\r\n]*/g, "")
  .replace(/<\/span>(?!$)/g, "\n")
  .replace(/<[^>]*>/g, "")
 alert($("#b").outerHTML)
}


</script>

</body>
</html>

Форум

Справочник

Discord чат

Курсы javascript