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. 1092 To Buy or Not to Buy

    题意:给出两个字符串s1和s2(长度不超过1000),问s1是否包含s2中的所有字符,若包含,则输出Yes,并输出s1中多余的字符个数:若不完全包含,则输出No,并输出缺少的个数. 思路:定义数组in ...

  2. krpano之鼠标样式修改

    引入cursors.js. cursors.js代码: <krpano > <events onxmlcomplete="action(qtvrcursor);" ...

  3. oracle更改编码

    背景:win764bit英文操作系统(支持中文) oracle11G默认安装 从ZHS16GBK字符集导入数据库 表现:plsql显示为乱码,所有汉字显示为“靠” 解决:1.查看并更改数据库的编码为Z ...

  4. 【问题】/usr/bin/env: php: 没有那个文件或目录

    php不是默认安装的,在使用symfony创建新项目时,出现这个提示. [root@localhost html]# symfony demo /usr/bin/env: php: 没有那个文件或目录 ...

  5. bash&nbsp;shell笔记5&nbsp;显示数据

    原创作品,允许转载,转载时请务必以超链接形式标明文章 原始出处 .作者信息和本声明.否则将追究法律责任.http://twentyfour.blog.51cto.com/945260/521455 知 ...

  6. eth0&nbsp;no&nbsp;such&nbsp;device(reload)

    转载自:http://blog.chinaunix.net/uid-25554408-id-292638.html 今天我在vmware里安装了虚拟机,安装虚拟机就想安装vmware tools(这个 ...

  7. spring集成Redis(单机、集群)

    一.单机redis配置 1. 配置redis连接池 <bean id="jedisPoolConfig" class="redis.clients.jedis.Je ...

  8. Catalan数计算及应用

    Catalan数列是非常奇妙的一列数字,因为很多问题的解就是一个Catalan数.知道了这一规律,很多看似复杂的问题便可迎刃而解.那么什么是Catalan数,什么样的问题的解是Catalan数呢? 1 ...

  9. php学习第一天-勤劳致富

    所谓“勤劳致富”,是很有科学依据的,且是经过我的亲身实践的. 自毕设突然转变为开发项目之后,整个天都变了.先是妹子给我订的票被强行取消,然后又是师兄的一句“***一小时就搞定了”,说明一下这个***是 ...

  10. 581. Shortest Unsorted Continuous Subarray连续数组中的递增异常情况

    [抄题]: Given an integer array, you need to find one continuous subarray that if you only sort this su ...