当由jquery设置时，Css顺序属性不会更新

Question

当在像这样呈现dom之后更新元素的顺序属性时，html元素无法重新排序。

$(".test").css('order', '0'); 

这是已知问题吗？

编辑：是的，容器具有下列CSS属性：

display: flex; 
flex-direction: column; 
overflow-y: overlay; 
overflow-x: hidden; 
position: relative; 

编辑：错误表现在拨弄https://jsfiddle.net/me6g30ur/

我的代码：

$(".update").on("click", function() { 
    for (var i = 0; i < $(".child").length; i++) { 
     $(".child").css("order", Math.floor(Math.random * 100)); 
    } 

    }); 

Answer 1

两个错误代码（从你的小提琴）

1. Math.random是一个函数，所以你需要做的Math.random()

2. 选择您需要的子元素进行更新。您可以使用:eq(index)选择为

最终代码：https://jsfiddle.net/me6g30ur/3/

$(".update").on("click", function() { 
    for (var i = 0; i < $(".child").length; i++) { 
     var order = Math.floor(Math.random() * 100); 
     $(".child:eq(" + i + ")").css("order", order); 
    } 

    }); 

---

旁注：

可能是更好的使用jQuery的.each循环，而不是一个for循环这将导致较少查询。

然后在循环中，你可以做this.style.order = Math.floor(Math.random() * 100);