2、设置一个30个以上的div（长10px,宽10px）,要求后一个div跟着前一个走，第1个div跟着鼠标走。

您可以使用JavaScript来实现这个功能。首先，您需要在HTML中创建一个父元素，然后使用JavaScript来动态创建30个子元素，并将它们添加到父元素中。然后，您需要使用鼠标事件来控制第一个子元素的位置，并使用JavaScript来控制后面的子元素跟随前一个子元素的位置。

下面是一个简单的实现示例代码：

HTML代码：

<div id="container"></div>

JavaScript代码：

// 获取父元素
var container = document.getElementById('container');

// 创建30个子元素并添加到父元素中
for (var i = 0; i < 30; i++) {
  var div = document.createElement('div');
  div.style.width = '10px';
  div.style.height = '10px';
  div.style.backgroundColor = 'red';
  container.appendChild(div);
}

// 鼠标移动事件
container.onmousemove = function(event) {
  // 获取鼠标位置
  var x = event.clientX;
  var y = event.clientY;
  
  // 设置第一个子元素的位置
  var firstDiv = container.children[0];
  firstDiv.style.position = 'absolute';
  firstDiv.style.left = x + 'px';
  firstDiv.style.top = y + 'px';
  
  // 设置后面的子元素跟随前一个子元素的位置
  for (var i = 1; i < container.children.length; i++) {
    var div = container.children[i];
    div.style.position = 'absolute';
    div.style.left = parseInt(container.children[i - 1].style.left) + 10 + 'px';
    div.style.top = container.children[i - 1].style.top;
  }
}

这段代码会在页面中创建一个父元素，然后动态创建30个子元素，并将它们添加到父元素中。当鼠标在父元素上移动时，第一个子元素会跟随鼠标移动，后面的子元素会跟随前一个子元素的位置。