按钮元素“包裹性”示意实例页面

展示

代码

• HTML：

  <div class="box">
    <p id="conMore" class="content">文字内容</p>
  </div>
  <!-- 按钮 -->
  <p><button id="btnMore">更多文字</button></p>

• CSS：

  .box {
    padding: 10px;
    background-color: #cd0000;
    text-align: center;
  }
  .content {
    display: inline-block;
    text-align: left;
  }

• JavaScript：

  var btn = document.getElementById('btnMore'), 
    content = document.getElementById('conMore');
  
  if (btn && content) {
    btn.onclick = function() {
      content.innerHTML += '-新增文字';
    };
  }