Question

我试图通过拆分给定的URL来创建一个带有正则表达式的简单面包屑：

输入是此表单中的网址 - http://someurl.com:1000/sites/Site1/Pages/Programs/Programs1/Programs2/SomePage.aspx?a=b;c=d

预计产量为 - 您在此处：网站＆gt;网站1＆gt;网页＆gt;程序＆gt;程序1＆gt;程序2＆gt; SomePage

以下是我使用的代码：

<script type="text/javascript">

var url ="http://someurl:1000/sites/Site1/Pages/Programs/Programs1/Programs2/SomePage.aspx?a=b;c=d"


var newURL = url.replace(new RegExp( "^(?:([^:/?#]+):)?(?://((?:(([^:@]*):?([^:@]*))?@)?([^:/?#]*)(?::(\\d*))?))?((((?:[^?#/]*/)*)([^?#]*))(?:\\?([^#]*))?(?:#(.*))?)", "g"),

  function( $0, $1, $2, $3, $4, $5, $6, $7, $8, $9){

  var domain = $1+ "://" + $2;
  var href = domain;
  var urlStrippedDown = $9;

  //Split the folders/pages within the path     /sites/Site1/Pages/Programs/Programs1/Programs2/SomePage.aspx
  var pieces = urlStrippedDown.replace( new RegExp (\\w+.aspx)|(\\w+),


  //Form the bread crumb with anchor tags and text
  function ($0, $1, $2)
  {

    zero = $0;
    var test =  "<a href='" + href +     urlStrippedDown.substring(0,urlStrippedDown.indexOf($0)+$0.length) +"'>" +     zero.replace('.aspx','')  + "</a>";
    return test;
  }
  );

  return pieces;
  }
);


//document.write("You are here: " + newURL.replace(/\//g,''));
document.write("You are here: " + newURL);

</script>

面临的问题：我面临的唯一问题是最终输出（newURL）在每个链接之间有一个正斜杠（“/”），我想用“＆gt;”代替但这似乎是不可能的。我不确定这个“/”是如何插入的，虽然它不会在形成“anchor”标签时将其显示为文本的一部分。

预期输出为 - 您在此处：网站＆gt;网站1＆gt;网页＆gt;程序＆gt;程序1＆gt;程序2＆gt;某些页面

而我得到 - 你在这里：/ sites / Site1 / Pages / Programs / Programs1 / Programs2 / SomePage 我无法将此“/”替换为“＆gt;”

P.S：注释的代码行 - 如果我替换这里，它将替换所有“/”甚至是锚标记内的那些。 “/”应该在文本中替换而不是在锚点的href中替换

正则表达式有缺陷吗？有没有更好的方法来处理这个？

谢谢！

Answer 1

尝试这种模式，根据您的要求选择所有“\”符号，将其替换为您想要的

(\/)(?=[^\/:]*(\/|$))(?=[^\/])

（/）（？= [^ /：] *（/ | $））匹配“/”仅当“/”后跟除“/”之外的所有字符，并且：next end with“/”或end of线

Answer 2

你的第一个替换实际上没有任何其他目的，除了将字符串拆分为部分：域和路径，而是你应该考虑在字符串上使用RegExp.exec并获得那些部分（参见片段）下文）。

您的newURL变量包含html，您可以利用它并在正则表达式中使用。如果您将所有/<a替换为> <a，则应该有一个字符串：> sites > Site1 > Pages > Programs > Programs1 > Programs2 > SomePage。然后你必须删除第一个>，因为我想你不想要那个。

你的正则表达式对于你的第一场比赛你需要的东西看起来过于复杂，你的第二次替换你可能更好地使用indexOf('/')和循环，因为你并没有真正利用正则表达式匹配。

下面您将找到一个函数，使用与初始解决方案类似的方法为任意有效URI创建所需的链接链。我修改你的代码是因为没有发布它似乎是浪费。

var url = "http://someurl:1000/sites/Site1/Pages/Programs/Programs1/Programs2/SomePage.aspx?a=b;c=d";

function makeBreadcrumb(url){
    // Split match and split url into domain and path.
    var urlSplitter = new RegExp("^(.*?://[^/]+?/)([^?#:@]*)", "");
    var matcher;
    if (matcher = urlSplitter.exec(url)) {
        var domain = matcher[1];
        // Match every "folder" or "file" in the URI and replace with "breadcrumb link".
        return matcher[2].replace(new RegExp("([^/]+)(?:\\.[^\\.]+$|/)","g"),
            function(match,dir,pos,string) {
                return (pos > 0 ? " > " : "") + "<a href=\"" + domain + string.substring(0,pos) + match + "\">" + dir + "</a>";
            }
        );
    }
    return "";
}

document.write("You are here: " + makeBreadcrumb(url));

简单的面包屑与正则表达式

2 个答案: