用js实现1, 记录图片位置: 页面上有一个红色div, 可以对该div实现拖拽, 每次拖拽后需要保存位置 下次重新进入该页面时, 该红色div还是在最后一次拖拽松开时的位置

可以通过以下代码实现：

HTML代码：

<div id="red-box"></div>

CSS代码：

#red-box {
  width: 100px;
  height: 100px;
  background-color: red;
  position: absolute;
}

JS代码：

var redBox = document.getElementById('red-box');
var x, y;

// 获取初始位置
if (localStorage.getItem('x') && localStorage.getItem('y')) {
  x = localStorage.getItem('x');
  y = localStorage.getItem('y');
} else {
  x = redBox.offsetLeft;
  y = redBox.offsetTop;
}

// 设置位置
redBox.style.left = x + 'px';
redBox.style.top = y + 'px';

// 拖拽事件
redBox.addEventListener('mousedown', function(e) {
  var disX = e.clientX - redBox.offsetLeft;
  var disY = e.clientY - redBox.offsetTop;
  
  document.addEventListener('mousemove', move);
  document.addEventListener('mouseup', up);
  
  function move(e) {
    x = e.clientX - disX;
    y = e.clientY - disY;
    
    redBox.style.left = x + 'px';
    redBox.style.top = y + 'px';
  }
  
  function up() {
    localStorage.setItem('x', x);
    localStorage.setItem('y', y);
    document.removeEventListener('mousemove', move);
    document.removeEventListener('mouseup', up);
  }
});

以上代码实现了对红色div的拖拽，并将位置保存在本地存储中，下次进入该页面时，div会显示在上一次拖拽松开的位置。