javascript - 在构建器中更改 z-index 的最简单方法

Question

我正在构建演示文稿构建器，在其中添加不同的元素（文本、图片、装饰元素）。我正在使用 jquery UI 来调整大小和拖动，但问题是我不知道如何操作 z-index。

我想添加功能来对覆盖的顺序进行排序。

元素是动态添加的，并且没有数量限制。

因此，如果我为所有元素添加带有 z-index: 1 的类，它将无济于事。我需要它们是可交换的：如果我有 4 个元素，我有 4 个类：.el1 {z-index= 1}、.el2 {z-index= 2}、.el3 {z-index= 3}、.el4 {z-index= 4}，如果我想在表面上获得 .el1，我必须给它一个 z-index:5;

如何以最有效的方式做到这一点？

Answer 1

在jQuery中，您可以使用.css()动态更改z-index属性。

喜欢

$(element).css('z-index', '1');

万一JS，

  var element = document.getElementById(id).style;  
  element.zIndex = 1;