基于jQuery的为attr添加id title等效果的实现代码


Posted in Javascript onApril 20, 2011

核心代码:

<script language="javascript" type="text/javascript"> 
$(document).ready(function(){ 
//$('div.chapter a').attr({'rel':'external'}); 
$('div.chapter a').each(function(index){ 
var $linkthis=$(this) 
$linkthis.attr({ 
'rel':'external', 
'id':'wikilink-'+index, 
'title':'你好,现在在试验'+$linkthis.text() 
}); 
}); 
$('#wikilink-1').css('fontSize',33); 
}); 
</script>

完整测试代码:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" 
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd"> 
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en"> 
<head> 
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> 
<title>DOM Manipulation</title> 
<script language="javascript" src="http://demo.3water.com/jslib/jquery/jquery-1.5.2.min.js"></script> 
<script language="javascript" type="text/javascript"> 
$(document).ready(function(){ 
//$('div.chapter a').attr({'rel':'external'}); 
$('div.chapter a').each(function(index){ 
var $linkthis=$(this) 
$linkthis.attr({ 
'rel':'external', 
'id':'wikilink-'+index, 
'title':'你好,现在在试验'+$linkthis.text() 
}); 
}); 
$('#wikilink-1').css('fontSize',33); 
}); 
</script> 
</head> 
<body> 
<!-- Begin example --> 
<h1 id="f-title">Flatland: A Romance of Many Dimensions</h1> 
<div id="f-author">by Edwin A. Abbott</div> 
<h2>Part 1, Section 3</h2> 
<h3 id="f-subtitle">Concerning the Inhabitants of Flatland</h3> 
<div id="excerpt">an excerpt</div> 
<div class="chapter"> 
<p class="square">Our Professional Men and Gentlemen are Squares (to which class I myself belong) and Five-Sided Figures or <a href="http://en.wikipedia.org/wiki/Pentagon">Pentagons</a>.</p> 
<p class="nobility hexagon">Next above these come the Nobility, of whom there are several degrees, beginning at Six-Sided Figures, or <a href="http://en.wikipedia.org/wiki/Hexagon">Hexagons</a>, and from thence rising in the number of their sides till they receive the honourable title of <a href="http://en.wikipedia.org/wiki/Polygon">Polygonal</a>, or many-Sided. Finally when the number of the sides becomes so numerous, and the sides themselves so small, that the figure cannot be distinguished from a <a href="http://en.wikipedia.org/wiki/Circle">circle</a>, he is included in the Circular or Priestly order; and this is the highest class of all.</p> 
<p><span class="pull-quote">It is a Law of Nature <span class="drop">with us</span> that a male child shall have <strong>one more side</strong> than his father</span>, so that each generation shall rise (as a rule) one step in the scale of development and nobility. Thus the son of a Square is a Pentagon; the son of a Pentagon, a Hexagon; and so on.</p> 
</div> 
</body> 
</html>
Javascript 相关文章推荐
关于图片按比例自适应缩放的js代码
Oct 30 Javascript
jquery实现弹出层效果实例
May 19 Javascript
JS拖拽插件实现步骤
Aug 03 Javascript
微信小程序  wx.request合法域名配置详解
Nov 23 Javascript
浅谈Angular的$q, defer, promise
Dec 20 Javascript
Angular directive递归实现目录树结构代码实例
May 05 Javascript
JavaScript函数、闭包、原型、面向对象学习笔记
Sep 06 Javascript
微信小程序解除10个请求并发限制
Dec 18 Javascript
vue 解决路由只变化参数页面组件不更新问题
Nov 05 Javascript
vue elementUI 表单校验的实现代码(多层嵌套)
Nov 06 Javascript
javascript设计模式 ? 桥接模式原理与应用实例分析
Apr 13 Javascript
vue自定义标签和单页面多路由的实现代码
May 03 Javascript
基于jquery的设置页面文本框 只能输入数字的实现代码
Apr 19 #Javascript
编写自己的jQuery插件简单实现代码
Apr 19 #Javascript
提升你网站水平的jQuery插件集合推荐
Apr 19 #Javascript
分享20款好玩的jQuery游戏
Apr 17 #Javascript
ModelDialog JavaScript模态对话框类代码
Apr 17 #Javascript
JavaScript中的isXX系列是否继续使用的分析
Apr 16 #Javascript
EXTJS FORM HIDDEN TEXTFIELD 赋值 使用value不好用的问题
Apr 16 #Javascript
You might like
php_xmlhttp 乱码问题解决方法
2009/08/07 PHP
一个简洁实用的PHP缓存类完整实例
2014/07/26 PHP
PHP判断网络文件是否存在的方法
2015/03/12 PHP
教大家制作简单的php日历
2015/11/17 PHP
php fread读取文件注意事项
2016/09/24 PHP
thinkPHP数据查询常用方法总结【select,find,getField,query】
2017/03/15 PHP
php微信公众号开发之简答题
2018/10/20 PHP
laravel 解决强制跳转 https的问题
2019/10/22 PHP
jquery简单实现滚动条下拉DIV固定在头部不动
2013/11/25 Javascript
node.js中的fs.mkdir方法使用说明
2014/12/17 Javascript
angularjs在ng-repeat中使用ng-model遇到的问题
2016/01/21 Javascript
基于jQuery实现仿百度首页选项卡切换效果
2016/05/29 Javascript
在js中实现邮箱格式的验证方法(推荐)
2016/10/24 Javascript
js实现百度地图定位于地址逆解析,显示自己当前的地理位置
2016/12/08 Javascript
基于JS实现移动端向左滑动出现删除按钮功能
2017/02/22 Javascript
json2.js 入门教程之使用方法与实例分析
2017/09/14 Javascript
从对象列表中获取一个对象的方法,依据关键字和值
2017/09/20 Javascript
Element-UI踩坑之Pagination组件的使用
2018/10/29 Javascript
react+ant design实现Table的增、删、改的示例代码
2018/12/27 Javascript
Vue实现摇一摇功能(兼容ios13.3以上)
2021/01/26 Vue.js
[01:08:09]DOTA2上海特级锦标赛主赛事日 - 1 胜者组第一轮#1Liquid VS Alliance第二局
2016/03/02 DOTA
php使用递归与迭代实现快速排序示例
2014/01/23 Python
windows下 兼容Python2和Python3的解决方法
2018/12/05 Python
2019 Python最新面试题及答案16道题
2019/04/11 Python
深入了解Python在HDA中的应用
2019/09/05 Python
重写django的model下的objects模型管理器方式
2020/05/15 Python
基于matplotlib中ion()和ioff()的使用详解
2020/06/16 Python
在CentOS7下安装Python3教程解析
2020/07/09 Python
手工制作的意大利皮革运动鞋:KOIO
2020/01/05 全球购物
学术会议欢迎词
2014/01/09 职场文书
总经理的岗位职责
2014/02/23 职场文书
求职自我推荐信
2014/06/25 职场文书
工作目标责任书
2014/07/23 职场文书
小学毕业典礼演讲稿
2014/09/09 职场文书
优秀教师个人材料
2014/12/15 职场文书
2016关于学习党章的心得体会
2016/01/15 职场文书