获取地址栏url最后一个斜杠后面的字符串

方法一

正则表达式:[^/]+(?!.*/)

[^/]+ 表示匹配任意长度的字符串,字符串中不包含有字符 / ,可以把以/分割开的字符串全匹配到.
.*/ 表示任意以/ 结尾的字符串,可以把后在带有/的字符串匹配到,前面再加上?!,再用圆括号包住表示排除掉.(?!.*/)
整个表达式的意思就是匹配任意长度的不包含/ 的字符串,并把以/结尾的字符串排除掉

var urlStr = location.pathname.match('[^/]+(?!.*/)')[0];

方法二

var urlStr = location.pathname; 
var index = urlStr.lastIndexOf('\/');  
urlStr = urlStr.substring(index + 1, urlStr.length);

示例

页面导航高亮选中当前栏目

index.html


<html>
<head>
<meta charset="utf-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
<title>Examplestitle>
<meta name="description" content="">
<meta name="keywords" content="">
<style>
    .active a {
        color: red;
    }
style>
head>
<body>
    
    <ul id="nav">
        <li><a href="index.html">首页a>li>
        <li><a href="about.html">关于a>li>
        <li><a href="news.html">新闻a>li>
        <li><a href="product.html">产品a>li>
        <li><a href="contact.html">联系a>li>
    ul>


    <script>
        /**
        * 页面导航高亮当前栏目
        */
        function navHighlight() {
            var urlArr = location.pathname.match('[^/]+(?!.*/)');
            var url = urlArr && urlArr[0] || 'index.html'; 
            var navLis = document.getElementById('nav').children;

            for (var i=0,len=navLis.length; i<len; i++) {
                var link = navLis[i].children[0];
                var href = link.getAttribute('href');

                if (href.indexOf(url) > -1) {
                    navLis[i].setAttribute('class', 'active');
                    return false;
                }
            }
        }

        window.onload = function() {
            navHighlight();
        };

    script>
body>
html>

你可能感兴趣的:(正则表达式)