Jquery 改变样式
Jquery简单的操作
Jquery 是一个非常好用JS库,有很多的特殊的操作,为了方便,我们都可以引入Jquery。
<script src="dist/js/vendor/jquery.min.js "></script>
修改样式
在写 web 项目是,往往我们的图标,都是一些<span></span>标签,我们是通过样式来修改显示的图标。
正如一个音乐播放器的暂停和修改:
<span class="fui-pause"></span>
<span class="fui-play"></span>
我们要通过改变<span></span> 中的 Class 样式来改变显示的图标。
具体的代码如下
网页部分:
<div class="list-group-item" id="Table_Open"><a >我的音乐<span class="fui-play"></span></a></div>
JS部分:
<script type="text/jscript">
$(document).ready(function() {
$("#Table_Open").click(function(){
var text=$(this).find("a span").attr("class");
if(text=='fui-play'){
$(this).find("a span").attr("class","fui-pause");
}else{
$(this).find("a span").attr("class","fui-play");
}
});
});
</script>
其中代码中,用到了 attr 函数:
attr(属性名):获取属性的值。
attr(属性名,属性值):是为了属性的值。
正如上面的实例所提及的,我们获取 span 标签下的 class 修改了它的样式的值。
Jquery 改变样式的更多相关文章
- javascript和jquery 移除事件 和 改变样式
javascript移除事件: document.getElementById("word").onmouseover = null; javascript改变样式: docume ...
- jquery 改变标签样式
jQuery改变标签的样式一般有3种 预置好class,然后通过jQuery改变元素的class名,使用的是addClass.removeClass 直接改变元素的css属性值,这种是通过添加styl ...
- web appbuilder 改变样式和添加自定义widget
一.改变样式 要实现的效果是添加cyan样式 1.将FoldableTheme/style下的cyan copy到TabTheme下的同一目录下: 2.打开TabTheme下的manifest,cop ...
- 标签(改变样式style)
id可以换为class,class对应的名字可以多个一样 <div class="box">box1</div> <div class="b ...
- ng-repeat动态改变样式
当我们使用AngularJs的ng-repeat时候动态绑定数据时,遇到遍历出来的标签样式都一样,这时候希望根据数组的下标分别对应不同的样式 解决:使用$index获取数组下标根据下标改变样式 < ...
- selenium用jquery改变元素属性
一.jQuery 语法 jQuery 语法是通过选取 HTML 元素,并对选取的元素执行某些操作. 1.基础语法: $(selector).action() 选择符(selector)即," ...
- 自己定义RatingBar,能依据设置改变样式
项目在我的GITHUB上 mirsfang的GitHub 一个简单的自己定义View ,为了一个 比較奇葩的需求而搞出来的.他的功能就是能让你自己设置图片和图片的大小以及星星的数量,是一个组合型的 ...
- 微信小程序,动态改变样式
小程序目前没有修改样式api,但是可以利用数据绑定实现动态改变样式,可以用view标签模拟page然后改变view标签的样式,以下案例演示了如果改变page背景颜色: <view class=& ...
- jQuery改变label/input的值,改变class,改变img的src
jQuery改变label/input的值.改变class,改变img的src jQuery改变label的值: $('#aID').text("New Value"); jQue ...
随机推荐
- SSD中的GC机制以及Trim
GC(Garbagecollection)垃圾回收 所谓GC就是把一个闪存块里的"有效"页数据复制到一个"空白"块里,然后把这个块完全擦除.GC是 SSD里的 ...
- Oracle常用的数值函数,日期函数
---恢复内容开始--- 数值函数 常用的处理数值的函数有如下: No. 函数名 含义 1 round(x[,y]) 返回四舍五入后的值 2 trunc(x[,y]) 不会四舍五入 3 mod(x,y ...
- 基于HTML5 Canvas 点击添加 2D 3D 机柜模型
今天又返回好好地消化了一下我们的数据容器 DataModel,这里给新手做一个典型的数据模型事件处理的例子作为参考.这个例子看起来很简单,实际上结合了数据模型中非常重要的三个事件处理的部分:属性变化事 ...
- tensorflow 学习笔记(转)
转自:http://blog.csdn.net/qq_32166627/article/details/52734387 侵删. tensorflow中有一类在tensor的某一维度上求值的函数.如: ...
- js中对节点属性的操作和对节点的操作
常用的节点属性操作方法 1.setAttribute(name,value):给某个节点添加一个属性 2.getAttribute(name):获取某个节点属性的值. 3.removeAttribut ...
- 这些 Drawable 的小技巧,你都了解吗?
一.前言 在 Android 的开发过程中,Drawable 经常会被用到,一般会用 Drawable 为 View 设置一个显示的效果.而在 Android 下,也提供了很多 Drawable 的默 ...
- C#、Java中的一些小功能点总结(持续更新......)
前言:在项目中,有时候一些小的功能点,总是容易让人忽略,但是这些功能加在项目中往往十分的有用,因此笔者在这里总结项目中遇到的一些实用的小功能点,以备用,并持续更新...... 1.禁用DataGrid ...
- 调参过程中的参数 学习率,权重衰减,冲量(learning_rate , weight_decay , momentum)
无论是深度学习还是机器学习,大多情况下训练中都会遇到这几个参数,今天依据我自己的理解具体的总结一下,可能会存在错误,还请指正. learning_rate , weight_decay , momen ...
- PDFBox 打印带背景的文件速度慢
打印慢的原因 java的RasterPrinterJob会执行很多次printPage方法 他应该是按块填充的, 如果页面元素非常复杂, 那么printPage方法可能会执行十几次. 而如果你用了如下 ...
- tolua++实现lua层调用c++技术分析
tolua++技术分析 cocos2dx+lua 前言 一直都使用 cocos2dx + lua 进行游戏开发,用 Lua 开发可以专注于游戏逻辑的实现,另外一方面可以实现热更新:而且 lua 是一个 ...