原生js写一个可随便移动的十字辅助线

好的，下面是代码实现：

首先，我们需要在HTML中创建一个<div>元素，用于表示十字辅助线，代码如下：

<div id="crosshair"></div>

然后，在CSS中，我们需要对这个元素进行一些样式设置，使其看起来像一个十字辅助线，代码如下：

#crosshair {
  position: absolute;
  width: 100%;
  height: 100%;
  pointer-events: none;
}

#crosshair::before,
#crosshair::after {
  content: "";
  position: absolute;
  background-color: red;
}

#crosshair::before {
  width: 1px;
  height: 100%;
  top: 0;
  left: 50%;
}

#crosshair::after {
  width: 100%;
  height: 1px;
  top: 50%;
  left: 0;
}

接下来，我们需要编写JavaScript代码，实现使这个十字辅助线可随意移动的功能。代码如下：

var crosshair = document.getElementById("crosshair");

document.addEventListener("mousemove", function(event) {
  var x = event.clientX;
  var y = event.clientY;
  
  crosshair.style.left = x + "px";
  crosshair.style.top = y + "px";
});

以上代码中，我们通过监听`mousemove`事件，获取鼠标的坐标，并将十字辅助线的位置设置为鼠标的位置。

好了，现在你可以试着将这段代码复制到你的HTML文件中，看看效果如何吧！