<!DOCTYPE html>
<html>
<head>
<style type="text/css">
#wrap div {
float: left;
}
#wrap:after {
content: "";
display: block;
clear: both;
}
</style>
<script type='text/javascript'>
document.addEventListener('DOMContentLoaded', function () {
var wrap = document.querySelector('#wrap');
var div = document.querySelectorAll('#wrap div');
var divArr = Array.prototype.slice.call(div).sort(function (a, b) {
return a.textContent > b.textContent ? 1 : -1;
});
divArr.forEach(function (p) {
wrap.appendChild(p);
});
});
</script>
</head>
<body>
<div id="wrap">
<div>Q</div>
<div>W</div>
<div>E</div>
<div>R</div>
<div>T</div>
<div>Y</div>
<div>U</div>
<div>I</div>
<div>O</div>
<div>P</div>
<div>A</div>
<div>S</div>
<div>D</div>
<div>F</div>
<div>G</div>
<div>H</div>
<div>J</div>
<div>K</div>
<div>L</div>
<div>Z</div>
<div>X</div>
<div>C</div>
<div>V</div>
<div>B</div>
<div>N</div>
<div>M</div>
</div>
</body>
</html>标签：function,document,DOM,JavaScript,var,wrap,div,排序 From： https://www.cnblogs.com/noorty/p/16584793.html