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. 校赛热身赛 Problem D. Unsolved Mystery

    Problem D. Unsolved MysteryThe world famous mathematician Wang Hao published a paper recently in the ...

  2. Kibana5.6安装

    Kibana5.6安装 1.下载 wget https://artifacts.elastic.co/downloads/kibana/kibana-5.6.8-linux-x86_64.tar.gz ...

  3. python开发函数进阶：命名空间，作用域，函数的本质，闭包，作用域方法（globales）

    一,命名空间 #局部命名空间#全局命名空间#内置命名空间 #三者的顺序#加载顺序       内置命名空间(程序运行前加载)->全局命名空间(程序运行中:从上到下加载)->局部命名空间(程 ...

  4. C#使用自定义字体

    /// <summary> /// 设置字体 /// </summary> /// <param name="path">字体文件路径,包含字体 ...

  5. Py修行路 python基础 （八）函数（随时更改）

    为何要用函数: 1.解决代码重用的问题 2.提高代码的可维护性,统一维护 3.程序的组织结构清晰,可读性强 定义函数 先定义后使用!!! def funcname(arg1,arg2,.....)  ...

  6. Python Twisted系列教程12：改进诗歌下载服务器

    作者:dave@http://krondo.com/a-poetry-transformation-server/  译者:杨晓伟(采用意译) 你可以从这里从头阅读这个系列. 新的服务器实现 这里我们 ...

  7. C#带百分比的进度条

    功能需求: 如果程序中会执行一个耗时的计算过程,我想在用户点击按钮后,弹出一个进度条窗口,显示正在执行的进度(最好能带有百分比),执行完成后,进度条窗口关闭,回到主程序窗口. 在关闭子窗口之前父窗体不 ...

  8. “Avoid non-default constructors in fragments: use a default constructor plus Fragment#setArguments(Bundle)instead”

    “Avoid non-default constructors in fragments: use a default constructor plus Fragment#setArguments(B ...

  9. 1&nbsp;任务管理&nbsp;&nbsp;--转载于电子工程世界

    uC/OS-II 中最多可以支持64 个任务,分别对应优先级0-63,其中0 为最高优先级.63为最低级,系统保留了4个最高优先级的任务和4个最低优先级的任务,所有用户可以使用的任务数有56个. uC ...

  10. dyld_decache&MesaSQLite

    [dyld_decache] Starting from iPhone OS 3.1, the individual libraries files supplied by the system ar ...