无需提交就可以改变页面内的链接地址

最新推荐文章于 2023-03-21 09:34:11 发布

Brad Woo

最新推荐文章于 2023-03-21 09:34:11 发布

阅读量137

点赞数

分类专栏： JavaScript 文章标签：应用服务器 HTML

JavaScript 专栏收录该内容

1 篇文章 0 订阅

订阅专栏

我所在的项目组总共有四种测试服务器加一个生产服务器：
My：个人开发用的本地服务器
team：本地项目组共享的测试服务器
DEV：远程开发测试服务器
SIT：系统集成测试服务器
Production：生产服务器

这四种都部署相同的应用，每一种服务器都需要用至少有5个URL去访问，这样我就需要在收藏夹里或者文本文件里添加25个地址。很烦难！

后来，我想了一个主意：做一个页面，放上5个不用应用的URL,再加上一个环境类型选择的下拉选择框。


<html>  
     <head>  
		<style>
			td.left-nav-overview{ background:#98b1c4; }
			a.left-nav-overview:link,
			a.left-nav-overview:visited{ text-decoration:none; color:#fff; }
			a.left-nav-overview:hover{ text-decoration:underline; color:#fff; }
			td.left-nav{ background-color:#c8d7e3; vertical-align:top; }
			a.left-nav:link,
			a.left-nav:visited{ text-decoration:none; color:#293d6b; }
			a.left-nav:hover{ text-decoration:underline; color:#293d6b; }
			tr.left-nav-last{ background-color:#c8d7e3; vertical-align:top; }
		</style>
        <title>地址变换小工具</title>  
        <script language="JavaScript" type="Text/JavaScript">//<!--  
			var currentType="localhost";
			function changeURL(selectBox){
				var tempType=currentType;
				currentType=selectBox.value;
				var alllinks=document.links;
				for(var i=0;i<alllinks.length;i++){
					alllinks[i].href=alllinks[i].href.replace(tempType,currentType);
				}
			} 
        //--></script>
     </head>  
     <body> 
		<table width="760" border="0" cellspacing="0" cellpadding="0" align="center">
			<tr valign="top">
				<td width="150">			
					<table border="0" cellpadding="0" cellspacing="0" width="150">
						<tr>
							<td> </td>
						</tr>
					</table>
					<table border="0" cellpadding="1" cellspacing="1" width="150">
						<tr>
							<td class="left-nav-overview"><a class="left-nav-overview" href="#">Home</a></td>
						</tr>
						<tr>
							<td class="left-nav">
								<a class="left-nav" href="//localhost/url_1">link_1</a>
							</td>
						</tr>
						<tr>
							<td class="left-nav">
								<a class="left-nav" href="//localhost/url_2">link_2</a></td>
						</tr>
						<tr>
							<td class="left-nav">
								<a class="left-nav"  href="//localhost/url_3">link_3</a></td>
						</tr>
						<tr>
							<td class="left-nav">
								<a class="left-nav" href="//localhost/url_4">link_4</a>
							</td>
						</tr>
						<tr>
							<td class="left-nav">
								<a class="left-nav" href="//localhost/url_5">link_5</a>
							</td>
						</tr>
						<tr class="left-nav-last">
							<td> </td>
						</tr>
					</table>
					<br>
					<select onchange="javascript:changeURL(this)">  
						<option value="localhost">My</option>  
						<option value="teamhost">Team</option>  
						<option value="devhost">DEV</option>  
						<option value="sithost">SIT</option>  
						<option value="prohost">Pro</option>  
					</select>  
				</td>
				<td width="10"> </td>
				<td width="600">
						<h1>地址变换小工具</h1>
					  <img src="" width="600" height="300">
				</td>
			</tr>
		</table>
	</body>  
</html>

Brad Woo

关注

0
点赞
踩
0

收藏

觉得还不错? 一键收藏
0
评论
无需提交就可以改变页面内的链接地址

我所在的项目组总共有四种测试服务器加一个生产服务器：My：个人开发用的本地服务器team：本地项目组共享的测试服务器DEV：远程开发测试服务器SIT：系统集成测试服务器Production：生产服务器这四种都部署相同的应用，每一种服务器都需要用至少有5个URL去访问，这样我就需要在收藏夹里或者文本文件里添加25个地址。很烦难！后来，我想了一个主意：做一个页面，放...
复制链接

扫一扫