如何使用JAVASCRIPT而不是jQuery使div在点击按钮时可展开-可折叠到左侧？

使用JavaScript而不是jQuery来实现div在点击按钮时可展开-可折叠到左侧，可以通过以下步骤实现：

HTML结构：在HTML中创建一个包含按钮和要展开-折叠的div的容器。例如：

<div>
  <button id="toggleButton">展开/折叠</button>
  <div id="content">这是要展开-折叠的内容</div>
</div>

CSS样式：使用CSS来设置初始状态和展开-折叠的效果。例如：

#content {
  width: 200px;
  height: 200px;
  background-color: #ccc;
  transition: width 0.5s;
}

.collapsed {
  width: 0;
}

JavaScript事件处理：使用JavaScript来处理按钮的点击事件，并根据当前状态切换展开-折叠效果。例如：

var toggleButton = document.getElementById('toggleButton');
var content = document.getElementById('content');

toggleButton.addEventListener('click', function() {
  if (content.classList.contains('collapsed')) {
    content.classList.remove('collapsed');
  } else {
    content.classList.add('collapsed');
  }
});

在上述代码中，我们通过使用classList来添加或删除collapsed类来实现展开-折叠的效果。

这样，当点击按钮时，div将展开或折叠到左侧。

这种方法使用纯JavaScript实现了div的展开-折叠效果，而不依赖于jQuery库。