Javaｓｃｒｉｐｔ实现表元素的排序。

我们可以看到很多可以在互联网上排序的种类，比如大小、时间、价格等等。

现在，让我们试试排序函数：

排序函数的代码：它包含单击后的排序——还原和升序和降序。

功能构成（）{
排序年龄，获取每个行对象，然后在第一个对象（从0开始）的大小顺序
无功tabnode = document.getelementbyid（憔悴）；
无功rows0 = tabnode.rows；
无功rows1 = { }；
现在，一个复制元素，第一行，没有排序
对于（var x = 1；x＜rows0.length；x++）{
rows1 { x 1 } = rows0 {X}；
}
对于（var x = 0；x＜rows1.length - 1；X + +）{ / /每个元素是一个行对象
对于（var y = x + 1；Y＜rows1.length；Y + +）{
将每个行解析为数字内容
如果（parseInt（rows1 {X}。细胞{ 1 }。innerHTML）> parseInt（rows1 { Y }。细胞{ 1 }。innerHTML））{
/ /警报（AA =+ X +：+ rows1 {X}。细胞{ 1 }。innerHTML）；
/ /警报（BB+ rows1 { Y }。细胞{ 1 }。innerHTML）；
VaR的温度= rows1 {X}；
rows1 {X} = rows1 { Y }；
rows1 { Y } =温度；
}
}
}

在恢复前排序后单击排序状态

如果（标志）{

对于（var x = 0；x＜rows1.length；x++）{
/ / tabnode。子{ 0 }。appendChild（行{X}）； / /方法：不一定兼容
rows1 {X}。parentnode.appendchild（rows1 {X}）；
}
其他{ }

对于（var x = 1；x＜rows0.length；x++）{
/ / tabnode。子{ 0 }。appendChild（行{X}）； / /方法：不一定兼容
rows0 {X}。parentnode.appendchild（rows0 {X}）；
}
}
标志；*！
以下是点/正后反显示正、反向的区别，它的作用是。
无功ageimg = document.getelementbyid（ageid ）；

如果（标志）{
对于（var x = 0；x＜rows1.length；x++）{ / /后的顺序是从0开始
/ / tabnode。子{ 0 }。appendChild（行{X}）； / /方法：不一定兼容
rows1 {X}。parentnode.appendchild（rows1 {X}）；
}
ageimg .innerHTML =年龄； / /套上面的图标

其他{ }
对于（var x = rows1.length-1；X = 0；x）{
/ / tabnode。子{ 0 }。appendChild（行{X}）； / /方法：不一定兼容
rows1 {X}。parentnode.appendchild（rows1 {X}）；
}
我们ageimg .innerHTML =年龄
}
标志=！国旗；
（加载）；即使在重新设置之后也会对颜色进行排序。

}
设置表的背景颜色代码，导入的CSS：

函数加载（）{
变量名；
无功tabnode = document.getelementbyid（憔悴）；
无功行= tabnode.rows； / /得到数组对象的每一行
无功rowslength = rows.length； / /每一行的长度
对于（var x = 1；x＜rowslength；x++）{ / /按每集
如果（x % = 2 = 0）{
行{X}。类名=的一个；
其他{ }
行{X}。类名=两；
}
当移动/跟随/移动时，在被记录的颜色之前，或向下移动之后都是一种颜色。
行{X}。onmouseover =函数（）{
名称= this.classname；
这一方法=三；
}
行{X}。onmouseout=函数（）{
这类名=名称；
}
}

}
指针函数（）{
加载（）；
}
CSS代码：

表TD：悬停{
背景颜色：# 0080c0；
}
一个{。
背景颜色：# 80ff00；
}
两{。
背景颜色：# ff8040；
}
三{。
背景颜色：# 008040；
}
表{
宽度：500px；
身高：500px；
边境：# 400040固体2px；
边界塌陷：塌陷；
}
表TD，{
边境：固体2px；
}
表第{
背景颜色：# c0c0c0；
}
效果图----排序前：
升序：
降序：
完整的代码：

sort.html

表TD：悬停{
背景颜色：# 0080c0；
}
一个{。
背景颜色：# 80ff00；
}
两{。
背景颜色：# ff8040；
}
三{。
背景颜色：# 008040；
}
表{
宽度：500px；
身高：500px；
边境：# 400040固体2px；
边界塌陷：塌陷；
}
表TD，{
边境：固体2px；
}
表第{
背景颜色：# c0c0c0；
}

函数加载（）{
变量名；
无功tabnode = document.getelementbyid（憔悴）；
无功行= tabnode.rows； / /得到数组对象的每一行
无功rowslength = rows.length； / /每一行的长度
对于（var x = 1；x＜rowslength；x++）{ / /按每集
如果（x % = 2 = 0）{
行{X}。类名=的一个；
其他{ }
行{X}。类名=两；
}
当移动/跟随/移动时，在被记录的颜色之前，或向下移动之后都是一种颜色。
行{X}。onmouseover =函数（）{
名称= this.classname；
这一方法=三；
}
行{X}。onmouseout=函数（）{
这类名=名称；
}
}

}
指针函数（）{
加载（）；
}
var标志=真；
功能构成（）{
排序年龄，获取每个行对象，然后在第一个对象（从0开始）的大小顺序
无功tabnode = document.getelementbyid（憔悴）；
无功rows0 = tabnode.rows；
无功rows1 = { }；
现在，一个复制元素，第一行，没有排序
对于（var x = 1；x＜rows0.length；x++）{
rows1 { x 1 } = rows0 {X}；
}
对于（var x = 0；x＜rows1.length - 1；X + +）{ / /每个元素是一个行对象
对于（var y = x + 1；Y＜rows1.length；Y + +）{
将每个行解析为数字内容
如果（parseInt（rows1 {X}。细胞{ 1 }。innerHTML）> parseInt（rows1 { Y }。细胞{ 1 }。innerHTML））{
/ /警报（AA =+ X +：+ rows1 {X}。细胞{ 1 }。innerHTML）；
/ /警报（BB+ rows1 { Y }。细胞{ 1 }。innerHTML）；
VaR的温度= rows1 {X}；
rows1 {X} = rows1 { Y }；
rows1 { Y } =温度；
}
}
}

在恢复前排序后单击排序状态

如果（标志）{

对于（var x = 0；x＜rows1.length；x++）{
/ / tabnode。子{ 0 }。appendChild（行{X}）； / /方法：不一定兼容
rows1 {X}。parentnode.appendchild（rows1 {X}）；
}
其他{ }

对于（var x = 1；x＜rows0.length；x++）{
/ / tabnode。子{ 0 }。appendChild（行{X}）； / /方法：不一定兼容
rows0 {X}。parentnode.appendchild（rows0 {X}）；
}
}
标志；*！
以下是点/正后反显示正、反向的区别，它的作用是。
无功ageimg = document.getelementbyid（ageid ）；

如果（标志）{
对于（var x = 0；x＜rows1.length；x++）{ / /后的顺序是从0开始
/ / tabnode。子{ 0 }。appendChild（行{X}）； / /方法：不一定兼容
rows1 {X}。parentnode.appendchild（rows1 {X}）；
}
ageimg .innerHTML =年龄； / /套上面的图标

其他{ }
对于（var x = rows1.length-1；X = 0；x）{
/ / tabnode。子{ 0 }。appendChild（行{X}）； / /方法：不一定兼容
rows1 {X}。parentnode.appendchild（rows1 {X}）；
}
我们ageimg .innerHTML =年龄
}
标志=！国旗；
（加载）；即使在重新设置之后也会对颜色进行排序。

}

全名
年龄
土生土长的Heath
狼
十三
长沙，湖南
丽莎
十五
常德，湖南
杰克
四十五
临澧，湖南
王
二十三
杭州，浙江
张
三十
安妮合肥
综合
二十三
益阳
哥哥
四十二
常德，湖南

以上就是本文的全部内容。它非常详细地教你如何对表单中的元素进行排序。感谢您阅读此Javaｓｃｒｉｐｔ，以实现表元素的排序操作。希望你能喜欢。