Javascript 如何使用JS从右到左显示面包屑？

如何从右向左显示面包屑导航菜单

e、 g:

文件标题«««

我正在使用下面从左到右显示的脚本，但我不知道如何正确地操作它

<script language="JavaScript">
<!-- 
  function breadcrumbs(){
    sURL = new String;
    bits = new Object;
    var x = 0;
    var stop = 0;
    var output = "<div class=topnav><A HREF=/>Hyperdisc</A> &raquo; ";

    sURL = location.href;
    sURL = sURL.slice(8,sURL.length);
    chunkStart = sURL.indexOf("/");
    sURL = sURL.slice(chunkStart+1,sURL.length)

    while(!stop){
      chunkStart = sURL.indexOf("/");
      if (chunkStart != -1){
        bits[x] = sURL.slice(0,chunkStart)
        sURL = sURL.slice(chunkStart+1,sURL.length);
      }else{
        stop = 1;
      }
      x++;
    }

    for(var i in bits){
      output += "<A HREF=\"";
      for(y=1;y<x-i;y++){
        output += "../";
      }
      output += bits[i] + "/\">" + bits[i] + "</A> &raquo; ";
    }
    document.write(output + document.title);
    document.write("</div>");
  }
 // -->
</script>

其中显示：

»»document.title

---

你不需要JS。您需要的是

direction

CSS属性。下面是测试用例

要点是：

ul {
  direction: rtl;
}
li { display: inline; }
a { display: inline-block; }

更新了如果您必须使用JS，这里有一个简单的片段：

var list = document.getElementById('nav'),
    lis = document.querySelectorAll('li'),
    l = lis.length - 1,
    i,
    newList = document.createElement('ul');

for(i = l; i >= 0; i--) {
  newList.appendChild(lis[i]);
}
list.parentNode.replaceChild(newList, list);

该代码段采用如下标记：

<ul id="nav">
  <li><a href="#">Home</a></li>
  <li><a href="#">myPage</a></li>
  <li>Document</li>
</ul>

文件

测试用例在这里-

为实际片段更新了

当涉及到问题中的实际代码时，您可能希望用以下代码段替换最后一个for（）循环中的所有内容：

document.write(output + document.title);
for(var i = bits.length - 1; i >= 0; i--){
  output += "&laquo; <A HREF=\"";
  for(y=1;y<x-i;y++){
    output += "../";
  }
  output += bits[i] + "/\">" + bits[i] + "</A>";
}
document.write("</div>");

document.write（输出+文档.标题）；
对于（变量i=bits.length-1；i>=0；i--）{
输出+=“«；”；
}
文件。填写（“”）；

JS是动态的。例如：如果用户在家中点击pg2，它会显示：home>pg2，然后点击pg3=home>pg2>pg3点击back to home=home>然后点击pg4=home>pg4，然后点击pg2=home>pg4>pg2 CSS是硬代码。请注意，我可能会混淆这些内容，但我看不出面包屑的动态特性如何与上面的CSS解决方案相冲突。我认为，如何构建面包屑超出了“如何从右到左显示面包屑”问题的范围。CSS精确地显示了如何“从右到左显示”。但是构建面包屑是完全不同的事情。@Andaero，我已经根据您的示例代码用代码片段扩展了答案。请检查一下。您的示例是一个简单的水平导航条。当您单击“主页”时，myPage将被删除。你的名单是硬编码的；想象一下，必须编写出数百个链接。。。。当用户点击链接并根据需要从面包屑路径中添加/减去链接时，JS会动态创建链接-一个真正的面包屑导航bar@Andaero我仍然相信你的问题误导了我。你问的是展示，但你的意思是建筑。代码中没有关于单击或任何其他事件的内容。因此，我认为我的答案完全满足了“如何从右到左显示面包屑导航菜单？”的问题，即使使用JS和实际代码的定制。我提供的代码不依赖于构建面包屑的方式，因此您可以硬编码，您可以使这些代码动态化，您可以随心所欲。但不管怎样，我没有太多时间来帮助回答误导性的问题，对不起。祝你好运