js怎么实现鼠标按下向左划或者向右划使div的宽变宽

可以使用JavaScript中的事件监听来实现这个功能。具体的实现步骤如下：

1. 给需要监听的div元素添加mousedown事件监听器，以监听鼠标按下事件。
2. 在mousedown事件监听器中，记录下鼠标按下时的初始位置。
3. 给document添加mousemove事件监听器，以监听鼠标移动事件。
4. 在mousemove事件监听器中，计算出鼠标移动的距离，并根据距离的正负来判断应该让div变宽还是变窄。
5. 给document添加mouseup事件监听器，以监听鼠标抬起事件。
6. 在mouseup事件监听器中，移除document上的mousemove和mouseup事件监听器。

以下是一个简单的实现示例：

<div id="myDiv" style="width: 100px; height: 100px; background-color: #ccc;"></div>

<script>
  var myDiv = document.getElementById('myDiv');
  var startX = 0;
  var startWidth = 0;

  myDiv.addEventListener('mousedown', function(event) {
    startX = event.clientX;
    startWidth = myDiv.offsetWidth;
    document.addEventListener('mousemove', onMouseMove);
    document.addEventListener('mouseup', onMouseUp);
  });

  function onMouseMove(event) {
    var distX = event.clientX - startX;
    if (distX > 0) {
      myDiv.style.width = startWidth + distX + 'px';
    } else {
      myDiv.style.width = startWidth - Math.abs(distX) + 'px';
    }
  }

  function onMouseUp() {
    document.removeEventListener('mousemove', onMouseMove);
    document.removeEventListener('mouseup', onMouseUp);
  }
</script>

在这个示例中，我们给myDiv元素添加了mousedown事件监听器，在mousedown事件监听器中记录了鼠标按下时的初始位置和div的初始宽度。接着，我们给document添加了mousemove事件监听器，在mousemove事件监听器中计算出鼠标移动的距离，并根据距离的正负来调整div的宽度。最后，我们给document添加了mouseup事件监听器，在mouseup事件监听器中移除了mousemove和mouseup事件监听器。这样，当鼠标抬起时，div的宽度就不会再发生变化了。