dom反转

<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>
</title>
<script src="js/jquery-1.11.0.min.js">
</script>
<style>
.div1{
width: 400px;
height: 400px;
background: red;
}
.div2{
width: 300px;
height: 300px;
background: green;
}
.div3{
width: 200px;
height: 200px;
background:black;
}
.div4{
width: 100px;
height: 100px;
background: yellow;
}
</style>
</head>
<body>
<div class="div1">
<div class="div2">
<div class="div3">
<div class="div4"></div>
</div>
</div>
</div>
</body>
<script>
$(function(){
var divli = $("body").find("div");
console.log(divli)
var list1 = [];
for(var i=0;i<divli.length; i++){
list1.push($(divli[i]).attr("class"));
}
console.log(list1) ;
var list2 = list1.reverse();
console.log(list2) ;
for(var i=0;i<divli.length; i++){
$(divli[i]).attr("class"," ").addClass(list2[i]);
}
})
</script>
</html>
dom反转的更多相关文章
- JQuery利用sort对DOM元素进行排序
前言 排序对于我们是再熟悉不过了,在绝大数应用程序中都会有这样一个场景:当我们从服务器端获取一个列表时,在界面上进行渲染,我们可以会依赖于某一个规则来进行排序,当然此时绝大多数会再次与服务器进行交互来 ...
- 十六天 css汇总、js汇总、dom汇总
1.css补充之 后台管理界面 顶部导航栏.左边菜单栏.右边内容栏固定在屏幕相应位置 会有上下左右滚动条,设定窗口最小值,使页面不乱.注意overflow:auto要与position:absol ...
- css补充、JavaScript、Dom
css补充: position: fixed:可以将标签固定在页面的某个位置 absolute+relative:通过两者的结合可以让标签在一个相对的位置 代码例子:(通过fixed标签将某些内容固定 ...
- Python自动化 【第十五篇】:CSS、JavaScript 和 Dom介绍
本节内容 CSS javascript dom CSS position标签 fixed: 固定在页面的某个位置 relative + absolute: 相对定位 opacity:0.5 设置透明度 ...
- javaScript DOM JQuery AJAX
http://www.cnblogs.com/wupeiqi/articles/5369773.html 一 JavaScript JavaScript是一门编程语言,浏览器内置了JavaScript ...
- Python-Day15 JavaScript/DOM
JavaScript JavaScript是一门编程语言,浏览器内置了JavaScript语言的解释器,所以在浏览器上按照JavaScript语言的规则编写相应代码之,浏览器可以解释并做出相应的处理. ...
- js常用内置对象、Dom对象、BOM对象
11.html元素事件属性中,如onclick="",双引号里可以是方法条用,可以是js代码(无需加<script>标签) 12.JavaScript内置 对象.属性和 ...
- Python学习笔记整理总结【web基础】【web/HTML/CSS/JavaScript/DOM/jQuery】
一.HTML HTML是英文Hyper Text Mark-up Language(超文本标记语言)的缩写,他是一种制作万维网页面标准语言(标记).相当于定义统一的一套规则,大家都来遵守他,这样就可以 ...
- JavaScript学习总结(一)——ECMAScript、BOM、DOM(核心、浏览器对象模型与文档对象模型)
一.JavaScript简介 JavaScript是一种解释执行的脚本语言,是一种动态类型.弱类型.基于原型的语言,内置支持类型,它遵循ECMAScript标准.它的解释器被称为JavaScript引 ...
随机推荐
- CentOS6.5安装图形用户界面
CentOS 6.5 安装图形界面 安装的时候没有安装图像界面.安装步骤如下: 1.yum -y groupinstall Desktop 2.yum -y groupinstall "X ...
- SSH(Spring Struts2 Hibernate)框架整合(注解版)
案例描述:使用SSH整合框架实现部门的添加功能 工程: Maven 数据库:Oracle 框架:Spring Struts2 Hibernate 案例架构: 1.依赖jar包 pom.xml < ...
- 使用mybatis assembly插件打成tar包,在linux系统中运行服务
使用mybatis assembly插件打成tar包,在linux系统中运行服务 assembly插件插件地址: 链接:https://pan.baidu.com/s/1i6bWPxF 密码:gad5 ...
- You must configure either the server or JDBC driver (via the serverTimezone configuration property
使用JDBC连接MySql时出现:The server time zone value '�й���ʱ��' is unrecognized or represents more than one ...
- docker 常用启动命令
数据库 # mongo sudo docker run -d -p 27017:27017 -v mongo_configdb:/data/configdb -v mongo_db:/data/db ...
- 那些年我们跳过的 IE坑
一, IE input X 去掉文本框的叉叉和密码输入框的眼睛图标 解: 从IE 10开始,type=”text” 的 input 在用户输入内容后,会自动产生一个小叉叉(X),方便用户点击清 ...
- vue_mint-ui
npm install mint-ui -S main.js import { Button } from 'mint-ui'; import "mint-ui/lib/style.css& ...
- Mac OS Sierra安装源不能设置任何来源(anywhere)
执行命令 sudo spctl --master-disable 此时再打开 System Preferences -> Security&Privacy 即可看到Anywhere
- Java演算法-「雞兔同籠問題」
/** * 雞兔同籠問題:窮舉算法思想 */ import java.util.*; public class ChichenAndHabbit { static int chichenNum,hab ...
- TSL 访问器
设计原理:GE有一个分布式内存基础设施,成为内存云.内存云由一组内存主干组成.集群中的每台机器承载256个内存中继.我们将一台机器的本地内存空间划分为多个内存中继的原因有两方面:1)中继级别的并行性可 ...