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,再次打开程序即可
随机推荐
- 安装sqoop
安装sqoop 1.默认已经安装好java+hadoop 2.下载对应hadoop版本的sqoop版本 3.解压安装包 tar zxvf sqoop-1.4.6.bin__hadoop-2.0.4-a ...
- google开发者工具调试技巧
http://blog.sina.com.cn/s/blog_60a4fcef0102v3vt.html
- 对rxandroid的简单理解
最近发现这个rxandroid挺火的,我就研究了一下,还真的挺不错. 首先在说之前可能很多人会和我刚刚学习的时候一样有很多疑问,如: 1:rxandroid是什么东西? 2:rxandroid能干嘛? ...
- 数组中pop()和reverse()方法调用
数组的倒序排列,可以采用reverse()和pop()方法进行排列.
- nodejs复习04
TCP/UDP网络应用 创建TCP服务器客户端 socket套接字对象实例,是对TCP协议的一个基本封装接口 clientt套接字对象实例 //server.js var net = require( ...
- 城管停车执法打印APP 移动云POS 现场打印告知单-执法平台+智能POS客户端系统
市城管局城管支队工作人员使用最新配备的城管执法手持终端对便道违法停放车辆进行拍照取证. 城管执法手持终端具备拍照.现场打印.无线传输等功能,执法人员只要在该终端登录,即可随时实现对违停车辆的拍照取证. ...
- JS typeof与instanceof的区别
typeof 与 instanceof 通常是用来判断一个变量的类型,二者有如下区别: typeof: 判断一个变量的类型,返回值是字符串形式,返回结果有如下几种: number,boolean,st ...
- dvb标准
一.概念 DVB, 数字视频广播Digital Video Broadcasting的缩写, 是由DVB项目维护的一系列国际承认的数字电视公开标准.(欧标)二.分类DVB系统传输方式有如下几种: 卫星 ...
- oracle plsql 无法连接 报 ORA-12560: TNS:protocol adapter error
ORA-12560: TNS:protocol adapter error 添加一个环境变量,名为TNS_ADMIN,值为 tnsnames.ora 文件所在路径.比如我的本机为:D:/instant ...
- 让/etc/profile文件修改后立即生效
方法1： 让/etc/profile文件修改后立即生效 ,可以使用如下命令: # . /etc/profile 注意: . 和 /etc/profile 有空格 方法2： 让/etc/profile ...