点击a标签页面跳转修改a标签的样式JS

原因：因为页面发生了跳转，单击事件addClass添加的样式只在一瞬间有用，因为a标签跳转页面刷新，事件失效了

解决方法（网上看到三种）：

1. 用cookie记录这个打开的序列号，然后页面在跳转的时候在读出来。
2. 循环a的链接，然后与location.href去比对，如果相同，或包含有同样字符串序列，则添加className.
3. 给每个页面写一个页面的id值，然后每次判断，有值则addClass

 <div class="xwdt-information-tabs" style="margin-left: -25px;margin-right: -25px;">
						   <a th:href="@{/help/1007}">
							   <div class="xwdt-select-a">xxxx
								   <span class="xwdt-select-b"></span>
							   </div>
						   </a>
						   <span class="xwdt-select-c"></span>
						   <a th:href="@{/help/1002}">
							   <div class="xwdt-select-a" style="background: none;border-radius: 0px;color: #324058">xxxx<span></span></div>
						   </a>
						   <span class="xwdt-select-c"></span>
						   <a th:href="@{/news/list}">
							   <div class="xwdt-select-a" style="background: none;border-radius: 0px;color: #324058">xxxx<span></span></div>
						   </a>
					   </div>

js代码：

var url = window.location.pathname;/* 获取文件路径（文件地址） */ 
//因为a标签是动态创建的，直接each a标签拿不到动态创建的a标签。所以要循环它的父级 循环父级子元素id为page的元素
			$(".xwdt-information-tabs").find("a").each(function (){
				if($(this).attr("href") == url){
					$(this).find("div").css({"background": "#0083FF", "border-radius": "20px", "color": "#FAFDFF"});
					$(this).find("span").addClass("xwdt-select-b");
					$(this).siblings().find("div").css({"background": "none", "border-radius": "0px", "color": "#324058"});
					$(this).siblings().find("span").removeClass("xwdt-select-b");
				}
			});

必要时对url进行裁剪判断：
substring，lastIndexOf常用

js获取当前url：

 var url;  
 
                url = window.location.href; /* 获取完整URL */  
                alert(url); /* http://127.0.0.1:8020/Test/index.html#test?name=test */  
 
                url = window.location.pathname; /* 获取文件路径（文件地址） */  
                alert(url); /* /Test/index.html */  
 
                url = window.location.protocol; /* 获取协议 */  
                alert(url); /* http */  
 
                url = window.location.host; /* 获取主机地址和端口号 */  
                alert(url); /* http://127.0.0.1:8020/ */  
 
                url = window.location.hostname; /* 获取主机地址 */  
                alert(url); /* http://127.0.0.1/ */  
 
                url = window.location.port; /* 获取端口号 */  
                alert(url); /* 8020 */  
 
                url = window.location.hash; /* 获取锚点（“#”后面的分段） */  
                alert(url); /* #test?name=test */  
 
                url = window.location.search; /* 获取属性（“?”后面的分段） */  
                alert(url);  
 
                /* 如果需要URL中的某一部分，可以自己进行处理 */  
                url = window.location.pathname;  
                url = url.substring(url.lastIndexOf('/') + 1, url.length);  
                alert(url); /* /index.html */  
 
                /*  
                * 如果页面使用了框架（frameset）  
                * 要获取到指定页面的URL  
                * 只要把window换成指定的页面即可  
                */  
                /* 'frame'为指定页面的class名 */  
                var url = window.parent.frames['frame'].location.href;  
                /* 获取当前地址栏中显示的URL */  
                var url = window.parent.location.href;  
                /* window parent 可互换 */  
                var url = parent.window.location.href;