jQuery标签操作
样式操作
样式类操作
//添加指定的css类名
$('元素选择器')addClass('类名'); //移除指定的css类名
removeClass(); //判断样式存不存在
hasClass(); ////切换css类名,有则删除,无则增加
toggleClass();
示例:
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Title</title> <style>
.c1{
width: 300px;
height: 300px;
background-color: pink;
} .c2{
width: 100px;
height: 100px;
background-color: black;
}
</style>
</head>
<body> <div class="c1"></div> <script src="jQuery.js"></script> <script>
// 添加指定CSS类名(指定CSS类名替换元素选择器指定的标签内容)
$('.c1').addClass('c2'); //移除指定CSS类名
$('.c1').removeClass('c2'); //判断指定CSS类名是否存在
$('.c1').hasClass('c2'); //查看指定CSS类名是否存在,有则删除,无则添加
$('.c1').toggleClass('c2');
</script> </body>
</html>
示例
CSS样式操作
原生js代码:
标签.style.属性 = '值'; jQuery代码:
单个css样式
$('元素选择器').css('属性','值');
设置多个css样式
$('元素选择器').css({'属性':'值',属性2:值2})
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Title</title>
</head>
<body>
<div class="c1"></div> <script src="jQuery.js"></script> <script>
// 设置单个css样式类
$('.c1').css('color','red'); // 设置多个css样式类
$('.c1').css({'width':'300px','height':'300px','background-color':'yellow'});
</script>
</body>
</html>
示例
jQuery标签操作的更多相关文章
- 前端09 /jQuery标签操作、事件、补充
前端09 /jQuery标签操作.事件.补充 目录 前端09 /jQuery标签操作.事件.补充 1.标签内文本操作 1.1 html标签元素中的所有内容 1.2 text 标签元素的文本内容 2.文 ...
- 前端08 /jQuery标签操作、事件
前端08 /jQuery标签操作.事件 目录 前端08 /jQuery标签操作.事件 1.标签内文本操作 1.1 html标签元素中的所有内容 1.2 text 标签元素的文本内容 2.文档标签操作 ...
- 转：jQuery 常见操作实现方式
http://www.cnblogs.com/guomingfeng/articles/2038707.html 一个优秀的 JavaScript 框架,一篇 jQuery 常用方法及函数的文章留存备 ...
- jQuery 常见操作实现方式
一个优秀的 JavaScript 框架,一篇 jQuery 常用方法及函数的文章留存备忘. jQuery 常见操作实现方式 $("标签名") //取html元素 document. ...
- jQuery DOM操作之结点转移复制
jQuery DOM操作之结点转移复制 $('div').append($('p'))这样即可把p标签移动到div标签里 $('div').append( $('p').html() )是把p标签里的 ...
- jQuery系列 第三章 jQuery框架操作CSS
第三章 jQuery框架操作CSS 3.1 jQuery框架的CSS方法 jQuery框架提供了css方法,我们通过调用该方法传递对应的参数,可以方便的来批量设置标签的CSS样式. 使用JavaScr ...
- 如何在js或者jquery中操作EL表达式的一个List集合
------------吾亦无他,唯手熟尔,谦卑若愚,好学若饥------------- 先说明此篇博客看明白了可以干嘛: 就是在js或者jquery中操作一个EL表达式的一个list集合或者复杂类型 ...
- jQuery基础操作
1.jQuery的介绍 jQuery是一个轻量级的.兼容多浏览器的JavaScript库.jQuery使用户能够更方便地处理HTML Document.Events.实现动画效果.方便地进行Ajax交 ...
- JQuery常用操作实现方式
http://www.cnblogs.com/guomingfeng/articles/2038707.html 一个优秀的 JavaScript 框架,一篇 jQuery 常用方法及函数的文章留存备 ...
随机推荐
- Spark获取DataFrame中列的几种姿势--col，$，column，apply
1.doc上的解释(https://spark.apache.org/docs/2.1.0/api/java/org/apache/spark/sql/Column.html) df("c ...
- QString int
QString转int 直接调用toInt()函数 例: QString str("100"); int tmp = str.toInt(); 或者: bool ok; QStri ...
- 在tomcat下context.xml中配置各种数据库连接池
作者:郑文亮 Tomcat6的服务器配置文件放在 ${tomcat6}/conf 目录底下.我们可以在这里找到 server.xml 和 context.xml.当然,还有其他一些资源文件.但是在在本 ...
- 【Leetcode_easy】849. Maximize Distance to Closest Person
problem 849. Maximize Distance to Closest Person solution1: class Solution { public: int maxDistToCl ...
- docker pull 提示错误的username or password
安装完docker后,使用cli docker pull images 时,提示用户名密码错误 解决方法 使用docker ID 不要使用 Email 登陆. https://github.com/d ...
- 第八章 跨语言服务治理方案 Service Mesh
8.1 Service Mesh 概述 新兴的下一代微服务架构,被称为下一代微服务,同时也是云原生技术栈的代表技术之一. 8.1.1 Service Mesh的由来 从2016年到2018年,serv ...
- Django2.2_No installed app with label 'admin'
版本:py37+django2.2 错误:项目启动时出现,No installed app with label 'admin' 原因:可以发现只要注释掉settings里面的数据库DATABASES ...
- mysql数据表的编辑
创建数据表 create table [if not exists] 表名(字段列表, [约束或索引列表]) [表选项列表]; 删除数据表 drop table [if exists] ...
- Transformer的numpy实现
下面的代码自下而上的实现Transformer的相关模块功能.这份文档只实现了主要代码.由于时间关系,我无法实现所有函数.对于没有实现的函数,默认用全大写函数名指出,如SOFTMAX 由于时间限制,以 ...
- R镜像源的切换
如果是默认的R安装一般会很慢 install.packages(pkgs, lib, repos = getOption("repos"), contriburl = contri ...