在页面中排序列表及其子页面

时间:2016-01-13 02:20:08

标签: javascript jquery

我有javascript正在查找当前页面网址并对其进行排序。在子页面上找到相同的列表。例如,父页面是刑法,但它也有多个子页面:攻击,威胁,家庭暴力等。子页面没有按字母顺序排列列表,我真的不知道如何做到这一点。我希望我能得到一些关于如何做到这一点的想法。我仍然是javascript的新手。

var currentPage = document.URL;
    if (currentPage == "http://www.jbplegal.com/criminal-law/") {

var items = $('#gb-simple-page-hierarchy-5 ul li').get();
items.sort(function(a,b){
  var keyA = $(a).text();
  var keyB = $(b).text();

  if (keyA < keyB) return -1;
  if (keyA > keyB) return 1;
  return 0;
});

HTML无序列表代码

<aside id="gb-simple-page-hierarchy-5" class="widget gb-page-hierarchy-widget"><h1 class="widget-title"><a href="http://www.jbplegal.com/criminal-law/">Criminal Defense Attorneys</a></h1><ul><li><a href="http://www.jbplegal.com/criminal-law/assault-and-menacing/">Assault and Menacing</a></li><li><a href="http://www.jbplegal.com/criminal-law/felonies/">Charged with Felonies</a></li><li><a href="http://www.jbplegal.com/criminal-law/child-abuse-child-endangerment/">Colorado Child Abuse</a></li><li><a href="http://www.jbplegal.com/criminal-law/controlled-substances/">Controlled Substances</a></li><li><a href="http://www.jbplegal.com/criminal-law/criminal-mischief/">Criminal Mischief</a></li><li><a href="http://www.jbplegal.com/criminal-law/criminal-record-sealing/">Criminal Record Sealing</a></li><li><a href="http://www.jbplegal.com/criminal-law/domestic-violence/">Domestic Violence</a></li><li><a href="http://www.jbplegal.com/criminal-law/failure-to-appear/">Failure to Appear</a></li><li><a href="http://www.jbplegal.com/criminal-law/felony-drug-charges/">Felony Drug Charges</a></li><li><a href="http://www.jbplegal.com/criminal-law/harassment/">Harassment</a></li><li><a href="http://www.jbplegal.com/criminal-law/juvenile-delinquency/">Juvenile Delinquency</a></li><li><a href="http://www.jbplegal.com/criminal-law/marijuana-related-offenses/">Marijuana-Related Offenses</a></li><li><a href="http://www.jbplegal.com/criminal-law/minor-in-possession/">Minor In Possession</a></li><li><a href="http://www.jbplegal.com/criminal-law/misdemeanor-charges/">Misdemeanor Charges</a></li><li><a href="http://www.jbplegal.com/criminal-law/protection-orders/">Protection Orders</a></li><li><a href="http://www.jbplegal.com/criminal-law/sex-offenses/">Sex Offenses</a></li><li><a href="http://www.jbplegal.com/criminal-law/theft-charges/">Theft Charges</a></li><li><a href="http://www.jbplegal.com/criminal-law/trespass/">Trespass</a></li></ul></aside>

3 个答案:

答案 0 :(得分:1)

我想你可以使用items.sort() 在您的代码中,在将子页面的所有值附加到另一个列表后,自动让JavaScript对其进行排序。

例如,

var values = [];
for (var i=0; i < items.length;i++) {
    values.append($(items[i]).text())
}
values.sort()
// Sorted values "Assault", "Domestic Violence", etc.

唯一的其他解决方法是使用一个允许对列表进行强健排序的库。

答案 1 :(得分:0)

这是一种方法:

// Get to the list and the items
var list = document.querySelector(".gb-page-hierarchy-widget ul");
var listItems = document.querySelectorAll(".gb-page-hierarchy-widget ul li a");

// Set up the variables
var i,j,li;
var arrItems = [];

// Loop through all the list items, creating an array of the text content
// followed by a ~ which represents the current position in the list
// Set a data-i attribute containing the current position in the list
// on the link (<a>) tag
for (i = 0; i < listItems.length; i++) {
   arrItems.push(listItems[i].textContent + '~' + i );
   listItems[i].setAttribute("data-i",i);
}

// Let JavaScript sort the array
arrItems.sort();

// Loop through the sorted array
for (i = 0; i< arrItems.length; i++) {
    // Discard the text, leaving only the current position of the
    // item in the list
    j = arrItems[i].replace(/^.*~/, '');
    // Get the parentNode (li) of the link
    li = document.querySelector('[data-i="'+j+'"]').parentNode;
    // Remove the list item (li) from the list
    list.removeChild(li);
    // Append the removed item to the end of the list
    list.appendChild(li);
}

答案 2 :(得分:0)

我终于发现了一些效果很好的东西!通过在互联网上进行一些搜索并进行一些修改,我能够使用它:

var pathArray = window.location.pathname.split( '/' );
var newPage = pathArray[1];

这将对父页面上的列表以及该父页面的任何子页面进行排序。