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()的更多相关文章

  1. jquery remove/add css

    <input type="submit" class="btn btn-primary" id="submit" value=&quo ...

  2. jQuery remove()与jQuery empty()的区别

    jQuery remove() 方法删除被选元素及其子元素.举例如下: <!DOCTYPE html> <html> <head> <script src=& ...

  3. jQuery中detach&&remove&&empty三种方法的区别

    jQuery中empty&&remove&&detach三种方法的区别 empty():移除指定元素内部的所有内容,但不包括它本身 remove():移除指定元素内部的 ...

  4. JQuery 加载 CSS、JS 文件

    JS 方式加载 CSS.JS 文件: //加载 css 文件 function includeCss(filename) { var head = document.getElementsByTagN ...

  5. Jquery remove 高级用法

    Jquery remove 高级用法 html 代码 <div class="file-image">abc1111</div><div class= ...

  6. JQuery中操作Css样式的方法

    JQuery中操作Css样式的方法//1.获取和设置样式 $("#tow").attr("class")获取ID为tow的class属性 $("#tw ...

  7. jQuery基础 - 改变CSS样式

    jQuery提供css()的方法来实现嵌入式改变元素样式,css()方法在使用上具有多样性.其中一种接受两个输入参数:样式属性和样式值,它们之间用逗号分开.比如我们要改变链接颜色,我们可以使用下面的代 ...

  8. jQuery修改操作css属性实现方法

    在jquery中我们要动态的修改css属性我们只要使用css()方法就可以实现了,下面我来给各位同学详细介绍介绍. css()方法在使用上具有多样性,我们先来了解css()方法基本知识. css() ...

  9. jQuery系列 第三章 jQuery框架操作CSS

    第三章 jQuery框架操作CSS 3.1 jQuery框架的CSS方法 jQuery框架提供了css方法,我们通过调用该方法传递对应的参数,可以方便的来批量设置标签的CSS样式. 使用JavaScr ...

随机推荐

  1. netty中的UDP

    UDP 提供了向多个接收者发送消息的额外传输模式: 多播——传输到一个预定义的主机组: 广播——传输到网络(或者子网)上的所有主机. 本示例应用程序将通过发送能够被同一个网络中的所有主机所接收的消息来 ...

  2. EasyUI TreeJson

    1. TreeJson str = GetTreeJsonByTable(dt, "); StringBuilder treeResult = new StringBuilder(); St ...

  3. jQuery笔记——选择器

    jQuery 最核心的组成部分就是:选择器引擎.它继承了 CSS 的语法,可以对 DOM 元 素的标签名.属性名.状态等进行快速准确的选择,并且不必担心浏览器的兼容性 常规选择器 根据id选择元素就是 ...

  4. python's eighth day for me

    f : 变量,f_obj, file, f_handler,...文件句柄. open : windows 的系统功能. windows 默认编码方式:gbk.   Linux 默认编码方式:utf ...

  5. 03-CSS中的选择器

    高级选择器分为: 后代选择器 子代选择器 并集选择器 交集选择器 后代选择器 使用空格表示后代选择器 , 顾名思义  父元素的后代(包括儿子,孙子,重孙子) 中间空格隔开 是后代 .container ...

  6. Java面向对象-访问控制权限

    Java面向对象-访问控制权限 Java中,可以通过一些Java关键字,来设置访问控制权限: 主要有 private(私有), package(包访问权限),protected(子类访问权限),pub ...

  7. Centos7下快速安装Mongo3.2

    Centos7下快速安装Mongo3.2 一般安装Mongo推荐源码安装,有时候为了快部署测试环境,或者仅仅是想装个mongo shell,这时候yum安装是最合适的方式, 下面介绍一下如何在Cent ...

  8. SqlServer数据导入到ORACLE

    ORACLE中执行 select * from SYSTEM."employ_epl"

  9. 并发之AtomicIntegerArray

    5 并发之AtomicIntegerArray     该类是Java对Integer数组支持的原子性操作:在认识这个类之前我们先来看一个方法,这个方法是Integer类中的:  public sta ...

  10. 四.python数据类型,语句

    Python基础 阅读: 120476 Python是一种计算机编程语言.计算机编程语言和我们日常使用的自然语言有所不同,最大的区别就是,自然语言在不同的语境下有不同的理解,而计算机要根据编程语言执行 ...