Jquery remove() empty() css()
1删除元素remove,empty
remove() 和 empty()的区别
remove:包括选中的元素包括其子元素,
empty:清除其子元素。
2.css属性
多属性使用{}括起来。
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>JQ-css</title>
<script type="text/javascript" src="jquery-3.3.1.js"></script>
<script>
$(document).ready(function () {
$("button").click(function () {
$("#div1").css({"background":"blue","border":"solid wheat"}) //多属性
$("#div2").css({"background":"purple","border":"solid red"})
})
})
</script>
</head>
<body>
<button>提交</button>
<div id="div1">div1</div>
<div id="div2">div2</div>
</body>
</html>
$即将进入JQ的遍历。
1.parent 被选元素的直接父元素。
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>JQ-遍历</title>
<script type="text/javascript" src="jquery-3.3.1.js"></script>
<script>
$(document).ready(function () {
$("#span").parent().css({"color":"red","border":"solid red"})
}) </script>
</head>
<body>
<!--灰色标注为初始颜色-->
<div id="div" style="border: grey solid">
div元素
<ul id="ul" style="border: grey solid">
ul元素
<li id="li" style="border: grey solid">
li元素
<br><span id="span" style="border: grey solid" >
sp元素
</span>
</li>
</ul> </div>
</body>
</html>
2.parents 选元素的所有祖先元素
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>JQ-遍历</title>
<script type="text/javascript" src="jquery-3.3.1.js"></script>
<script>
$(document).ready(function () {
$("#span").parents().css({"color":"red","border":"solid red"})
}) </script>
</head>
<body>
<!--灰色标注为初始颜色-->
<div id="div" style="border: grey solid">
div元素
<ul id="ul" style="border: grey solid">
ul元素
<li id="li" style="border: grey solid">
li元素
<br><span id="span" style="border: grey solid">
sp元素
</span>
</li>
</ul> </div>
</body>
</html>
3.返回介于两个给定元素之间的所有祖先元素。
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>JQ-遍历</title>
<script type="text/javascript" src="jquery-3.3.1.js"></script>
<script>
$(document).ready(function () {
$("#span").parentsUntil("#div").css({"color":"red","border":"solid red"})
}) </script>
</head>
<body>
<!--灰色标注为初始颜色-->
<div id="div" style="border: grey solid">
div元素
<ul id="ul" style="border: grey solid">
ul元素
<li id="li" style="border: grey solid">
li元素
<br><span id="span" style="border: grey solid">
sp元素
</span>
</li>
</ul> </div>
</body>
</html>
Jquery remove() empty() css()的更多相关文章
- jquery remove/add css
<input type="submit" class="btn btn-primary" id="submit" value=&quo ...
- jQuery remove()与jQuery empty()的区别
jQuery remove() 方法删除被选元素及其子元素.举例如下: <!DOCTYPE html> <html> <head> <script src=& ...
- jQuery中detach&&remove&&empty三种方法的区别
jQuery中empty&&remove&&detach三种方法的区别 empty():移除指定元素内部的所有内容,但不包括它本身 remove():移除指定元素内部的 ...
- JQuery 加载 CSS、JS 文件
JS 方式加载 CSS.JS 文件: //加载 css 文件 function includeCss(filename) { var head = document.getElementsByTagN ...
- Jquery remove 高级用法
Jquery remove 高级用法 html 代码 <div class="file-image">abc1111</div><div class= ...
- JQuery中操作Css样式的方法
JQuery中操作Css样式的方法//1.获取和设置样式 $("#tow").attr("class")获取ID为tow的class属性 $("#tw ...
- jQuery基础 - 改变CSS样式
jQuery提供css()的方法来实现嵌入式改变元素样式,css()方法在使用上具有多样性.其中一种接受两个输入参数:样式属性和样式值,它们之间用逗号分开.比如我们要改变链接颜色,我们可以使用下面的代 ...
- jQuery修改操作css属性实现方法
在jquery中我们要动态的修改css属性我们只要使用css()方法就可以实现了,下面我来给各位同学详细介绍介绍. css()方法在使用上具有多样性,我们先来了解css()方法基本知识. css() ...
- jQuery系列 第三章 jQuery框架操作CSS
第三章 jQuery框架操作CSS 3.1 jQuery框架的CSS方法 jQuery框架提供了css方法,我们通过调用该方法传递对应的参数,可以方便的来批量设置标签的CSS样式. 使用JavaScr ...
随机推荐
- Zabbix自定义监控网站服务是否能够正常响应
监测tcp连接数文件名: /etc/zabbix/zabbix_agentd.conf.d/count_tcp.conf UserParameter=count.tcp,netstat -s|g ...
- springboot成神之——spring文件下载功能
本文介绍spring文件下载功能 目录结构 DemoApplication WebConfig TestController MediaTypeUtils 前端测试 本文介绍spring文件下载功能 ...
- list map set 集合的区别
Java中的集合包括三大类,它们是Set.List和Map,它们都处于java.util包中,Set.List和Map都是接口,它们有各自的实现 类.Set的实现类主要有HashSet和TreeSet ...
- SQL提取数据库表名,字段名等信息
-------提取数据库所有表的表名.字段名 -------在SQLserver 2000中测试 --查询所有用户表所有字段的特征 SELECT D.Name as TableName, A.colo ...
- 成都国嵌-嵌入式linux必修实验手册…
emouse收集整理,转载请注明: emouse的技术专栏 博客园:http://www.cnblogs.com/emouse/ CSDN:http://blog.csdn.net/haozi_198 ...
- Spring整合web项目原理
- 局域网内的一些计算机可以ping通 有些ping不同
如何查看.添加.修改.删除电脑内部路由_百度经验https://jingyan.baidu.com/article/77b8dc7fc611626174eab6cb.html
- 用eclipse+svn插件,上传新项目到svn服务器
给定trunk路径,https://svn.ws.125089.com/public/nlp/3434index/IndexByModelSolr/trunk/. 其中自己的web项目名字是Index ...
- linux top 命令各参数详解
简介 top命令是Linux下常用的性能分析工具,能够实时显示系统中各个进程的资源占用状况,类似于Windows的任务管理器. top显示系统当前的进程和其他状况,是一个动态显示过程,即可以通过用户按 ...
- Java-Decimal
import java.math.BigDecimal; import java.text.DecimalFormat; import java.text.NumberFormat; public c ...