​x
 
<!DOCTYPE html>
<html>
<body>
​
<p>单击按钮来创建一些 BR 元素。</p>
​
<button onclick="myFunction()">试一试</button>
​
<p>当您单击该按钮时，会在 div 中的每个 span 元素之前插入一个 br 元素，从而在下面的文本中进行适当的换行。</p>
​
<div id="myDIV">
  <span>Hello,</span>
  <span>My name is Bob.</span>
  <span>I live in Bobville.</span>
  <span>I am 45 years old.</span>
</div>
​
<script>
function myFunction() {
  // 获取 id="myDIV" 的 div 元素
  var div = document.getElementById("myDIV"); 
​
  // 获取 div 内的所有 span 元素
  var spans = div.getElementsByTagName("SPAN");  
​
  // 创建一个循环，它将在 div 中的每个 span 元素之前插入一个 br 元素，从第二个 span 元素开始
  var i;
  for (i = 1; i < spans.length; i++) {
    var newElem = document.createElement("BR");
    div.insertBefore(newElem, spans[i]);
  }
}
</script>
​
</body>
</html>
​