Web Modify The Html Elements According Url Parameters With Jquery
需求说明
根据URL的参数, 来批量的对某些HTML元素做统一的修改.
解决思路
首先, 想办法获得这个URL的参数, 然后遍历对应的HTML元素, 做出对应的修改. 即可.
代码实现
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>Demo</title>
</head>
<body>
<ul>
<li><a href="https://baidu.com/index.html" target="_blank"> Link 1 </a></li>
<li><a href="https://baidu.com/index.html" target="_blank"> Link 1 </a></li>
<li><a href="https://baidu.com/index.html" target="_blank"> Link 1 </a></li>
<li><a href="https://baidu.com/index.html" target="_blank"> Link 1 </a></li>
</ul>
</body>
</html>
<script src="http://libs.baidu.com/jquery/1.10.2/jquery.min.js"></script>
<script type="text/javascript">
function GetString(name)
{
var reg = new RegExp("(^|&)"+ name +"=([^&]*)(&|$)");
var r = window.location.search.substr(1).match(reg);
if(r!=null)return unescape(r[2]); return null;
}
$(document).ready(function()
{
$("a").each(function()
{
var link = $(this).prop("href");
link = link + "?id=" + GetString("id");
$(this).prop("href", link);
});
});
</script>
小结
网上,也有其他的原生js的实现,但是方法着实头疼,看懂都费劲儿. 通过利用一些库,可以把代码写的简洁,便于阅读. 这才是好的解决方法.
Web Modify The Html Elements According Url Parameters With Jquery的更多相关文章
- Get URL parameters & values with jQuery
原文: http://jquery-howto.blogspot.jp/2009/09/get-url-parameters-values-with-jquery.html In this post, ...
- [React Router v4] Use URL Parameters
URLs can be looked at as the gateway to our data, and carry a lot of information that we want to use ...
- Web Components之Custom Elements
什么是Web Component? Web Components 包含了多种不同的技术.你可以把Web Components当做是用一系列的Web技术创建的.可重用的用户界面组件的统称.Web Com ...
- Web开发HTTP中URI和URL的情感纠葛
作者:郭无心链接:https://www.zhihu.com/question/21950864/answer/66779836来源:知乎著作权归作者所有.商业转载请联系作者获得授权,非商业转载请注明 ...
- Python的Web编程[0] -> Web客户端[0] -> 统一资源定位符 URL
统一资源定位符 / URL 目录 URL 构成 URL 解析 URL 处理 1 URL构成 统一资源定位符(Uniform Resource Locator) 是对可以从互联网上得到的资源的位置和访问 ...
- 玩转web之ligerui(一)---ligerGrid重新指定url
请珍惜小编劳动成果,该文章为小编原创,转载请注明出处. 在特定情况下,我们需要重新指定ligerGrid的url来获取不同的数据,在这里我说一下我用的方法: 首先先定义一个全局变量,然后定义liger ...
- [Angular 8] Take away: Web Components with Angular Elements: Beyond the Basics
This post is based on the NG-CONF talk, check the talk by yourself. 1. Dynamiclly add Angular Elemen ...
- How to get URL parameters with Javascript?
function getURLParameter(name) { return decodeURIComponent((new RegExp('[?|&]' + name + '=' + '( ...
- 尚未配置为Web项目.指定的本地IIS URL http://localhsst/..要打开项目，需要配置虚拟目录 。是否立即创建虚拟目录 解决
1.编辑.csproj文件 2.修改 UseIIS节点改为false,再次打开程序即可
随机推荐
- 【Apache RocketMQ】RocketMQ捐赠给Apache那些鲜为人知的故事-转自阿里中间件
序言 今年的双十一对阿里巴巴中间件消息团队来说,注定是个不平凡的日子.在这一天,稳定性小组重点攻克的低延迟存储解决方案成功地经受住了大考.整个大促期间,99.996%的延迟落在了10ms以内,极个别由 ...
- tecplot 脚本文件
一个简单的C++代码,可以生成tecplot的脚本文件,打开文件就能自动绘图.绘图过程是先把文件导入,然后镜像,最后生成一个动画,但是导入的文件名称要求是有规律的. /* ** This progra ...
- iOS之转场动画
CodeApp地址CATransition_Demo:https://github.com/Wheat-Qin/CATransition_Demo iOS中比较全的翻转过渡动画(不只是苹果提供的).包 ...
- 控制Storyboard播放zz
<Grid Width="300" Height="460"> <Grid.RowDefinitions> <RowDefinit ...
- 关于CSV文件 Excel打开乱码问题的解决方案
近日写java程序中,将数据输出到csv文件中,发现Excel打开之后,中文均为乱码 于是寻找解决方案,发现最简单的方式还是如此了 1. 将输出的csv文件用记事本打开 2. 另存为将文件编码格式改为 ...
- Theano 学习笔记(一)
Theano 学习笔记(一) theano 为什么要定义共享变量? 定义共享变量的原因在于GPU的使用,如果不定义共享的话,那么当GPU调用这些变量时,遇到一次就要调用一次,这样就会花费大量时间在数据 ...
- Django框架学习
两个月前学习的Django框架,写了个简易婚恋调查网站,代码就懒得全贴了,有两张图记录下
- [BZOJ4197][Noi2015]寿司晚宴
4197: [Noi2015]寿司晚宴 Time Limit: 10 Sec Memory Limit: 512 MBSubmit: 412 Solved: 279[Submit][Status] ...
- 一张图系列——为什么在DllMain里面创建了线程并Wait会卡死
这是一个老话题了,推荐一篇文章: http://blog.csdn.net/breaksoftware/article/details/8150476#0-tsina-1-83826-39723281 ...
- web前端面试题汇总
1.doctype作用 <!DOCTYPE>声明位于位于HTML文档中的第一行,处于 <html> 标签之前.告知浏览器的解析器用什么文档标准解析这个文档.DOCTYPE不存在 ...