js获取URL请求参数与改变src_js 传递参数到src替换部分内容-优快云博客

本文介绍如何使用原生JavaScript及jQuery从URL中获取指定参数，并根据该参数动态加载图片资源。首先通过正则表达式匹配URL参数，然后设置图片源。jQuery扩展方法提供了更简洁的API来实现相同功能。

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

js实现:

<script>
			function GetQueryString(name) {
				var reg = new RegExp("(^|&)" + name + "=([^&]*)(&|$)");
				var r = window.location.search.substr(1).match(reg);
				if(r != null) return unescape(r[2]);
				return null;
			}	
		    
			window.onload=function() {
				var img=document.getElementById("type");
			
				img.setAttribute("src","img/tiche/"+GetQueryString("carmodel")+".jpg");
			}
		
		</script>

<div style="margin-top:40px">
			<img src="" width="100%">
			<img src="" width="100%">
			<img id="type" src="" width="100%">
		</div>

Jquery实现：

<script src="js/jquery-1.11.1.min.js"></script>
		<script src="js/jquery.form.js"></script>
		<script>
			$.extend({
				getUrlVars: function() {
					var vars = [],hash;
					var hashes = window.location.href.slice(window.location.href.indexOf('?') + 1).split('&');
					for(var i = 0; i < hashes.length; i++) {
						hash = hashes[i].split('=');
						vars.push(hash[0]);
						vars[hash[0]] = hash[1];
					}
					return vars;
				},
				getUrlVar: function(name) {
					return $.getUrlVars()[name];
				}
			});
		</script>

调用方法：

<script>
			//Get object of URL parametersvar 
			allVars = $.getUrlVars();
			// Getting URL var by its namvar 
			byName = $.getUrlVar('name');
		  </script>