JQuery实现通过点击标题切换字体
这个主要通过判断被点击的元素的子元素中是否包含了b元素来进行字体的切换,其中wrapInner函数是为了在$author元素的内部添加b标签。
切换回正常字体是通过将内容转化为纯文本形式,再替换元素内容来实现的。
$('#f-author').css('cursor','pointer');
$('#f-author').click(function(event){
var $author = $(this);
if(!$author.children().is('b')){//子元素没有b
$author.wrapInner('<b></b>');//包含在$author里面
}
else{
var text = $author.text(); //纯文本
$author.text(text);
}
});
JQuery实现通过点击标题切换字体的更多相关文章
- jquery如何实现点击标题收缩下面的内容
jquery如何实现点击标题收缩下面的内容 一.总结 一句话总结:怎么做复杂前端任务,先把样式(最简单)做出来,然后在写js. 1.如何取jquery集合中的某个索引号的元素? 不是get(),是eq ...
- JQuery实现点击按钮切换图片(附源码)--JQuery基础
JQuery实现切换图片相对比较简单,直接贴代码了哈,有注释噢!疑问请追加评论哈,不足之处还请大佬们指出! 1.案例代码: demo.html: <!DOCTYPE html><ht ...
- jQuery点击缩略图切换大图代码
很多网站上都会有点击缩略图切换成大图的效果,下面来分享一下它的源码 还是先来看效果截图 运行文件 然后点击下一张 下面分享源代码 html文件 <!DOCTYPE html PUBLIC &qu ...
- jquery 实现点击颜色切换
<!DOCTYPE html> <html> <head> <meta http-equiv="Content-Type" content ...
- 利用jquery写的一个TAB页切换效果
函数如下 /** *切换效果 */ function switab(tab,con,tab_c_css,tab_n_css,no) { $(tab).each(function(i){ if(i == ...
- jQuery Mobile 连接外部连接或切换动画
jQuery Mobile不同网页之间的跳转问题 jQuery Mobile,一个新的手机终端脚本开发库,从名字可以看出,它是基于jQuery:目前支持很多种手机设备,包括IOS/Android/Bl ...
- JS框架_(JQuery.js)文章全屏动画切换
百度云盘 传送门 密码:anap 文章全屏动画切换效果 <!doctype html> <html lang="zh"> <head> < ...
- jQuery鼠标滚动垂直全屏切换代码
体验效果:http://hovertree.com/texiao/jquery/68/ 源码下载:http://hovertree.com/h/bjaf/f643upc4.htm 代码如下: < ...
- IOS 修改UIAlertController的按钮标题的字体颜色,字号,内容
IOS 修改UIAlertController的按钮标题的字体颜色,字号,内容 UIAlertController *alertVC = [UIAlertController alertControl ...
随机推荐
- 关于PHP单双引号解析变量的问题
双引号可以解析变量,单引号不行 $qweqwe = 123; echo "$qweqwe"; 输出123 echo '$qweqqwe'; 输出$qweqwe
- 10分钟精通SharePoint - SharePoint升级
类型: b2b(安装更新)和v2v(跨版本升级) 内容:二进制文件和数据库 过程: 升级前检查 - 检查场内数据,配置和自定义等等 升级准备和计划 - 根据需要和升级检查制定相应计划和准备工作 ...
- 用javascript动态改变网页文字大小
<script>function setFontSize(size){document.getElementById('bottom').style.fontsize=size+'pt'; ...
- Tomcat+Eclipse乱码问题解决方法
概述 乱码问题是大家在日常开发过程中经常会遇到的问题,由于各自环境的不同,解决起来也费时费力,本文主要介绍一般性乱码问题的解决方法与步骤,开发工具采用Eclipse+Tomcat,统一设置项目编码UT ...
- - (BOOL)setResourceValue:(id)value forKey:(NSString *)key error:(NSError **)error
如果我们的APP需要存放比较大的文件的时候,同时又不希望被系统清理掉,那我么我们就需要把我们的资源保存在Documents目录下,但是我们又不希望他会被iCloud备份,因此就有了这个方法 [URL ...
- CSS.02 -- 样式表 及标签分类(块、行、行内块元素)、CSS三大特性、背景属性
样式表书写位置 内嵌式写法 <head> <style type="text/css"> 样式表写法 </style> </head&g ...
- Vim快速入门
学习自:实验楼 Vim具有6种基本模式和5种派生模式 普通模式: vim启动后的默认模式,常用的编辑器命令诸如移动光标,删除文本. 普通模式中,有很多方法进入插入模式,常用 a 或 i 键. 插入模式 ...
- flex盒子里面元素linehight对高度的影响
那天,高高兴兴的测试flex属性.大家都知道,当父盒子display:flex的时候,子盒子即使宽高和大于父盒子,也会由于flex的特性进行收缩:然而,在给父盒子加了flex-direction:co ...
- 关于EF+MVC5分页查询数据效率问题
2017-03-31 11:57:41,290 [5] ERROR ErrorMsg - System.Data.Entity.Core.EntityCommandExecutionException ...
- 如何查看sql server端口号
通过sql server配置管理器-->sql server网络配置-->选择-->通过右侧选择TCP/IP(已启用)-->查看属性 还可以通过sql语句查看: exec sy ...