<!DOCTYPE html>
<html>
<head>
    <meta charset="utf-8">
    <title>ECharts</title>
    <!-- 引入 echarts.js -->
     <script src="jquery/jquery-3.2.1.js"></script>
     <style>
         .class1{
             width: 400px;
             height: 300px;
             border: 1px solid red;
         }
         
         .class1{
                      width: 400px;
                      height: 300px;
                      border: 1px solid red;
         }
         .div1{
             display: flex;
            align-items: center;
            flex-direction: column;
            justify-content: space-around;
             border: 1px solid red;
         }
         
         .div2{
             background-color: #0000FF;
         }
         .div3{
                      background-color: red;
         }
     </style>
</head>
<body>
    <!-- 为ECharts准备一个具备大小(宽高)的Dom -->
    <div></div>
    <div class="div1" id="box1"></div>

<script type="text/javascript">
        // 基于准备好的dom,初始化echarts实例
        var data = [{name:'陕西',type:1},{name:'商洛',type:2},{name:'安康',type:4},{name:"渭南",type:3}];
        var html = '' ;
        debugger
        for(var i= 0; i<data.length;i++){
            var DIV2 = 'div2';
            if(data[i].type%2==0){
                DIV2 = 'div3';
            }
        
            html +=  '<div class="div1 '+DIV2+'">'+data[i].name+'</div>'
        }
        
         $('#box1').append(html); 
         
    </script>
</body>
</html>

jq循环改变class样式相关推荐

  1. JQ获取 改变css样式

    //1.获取和设置样式 $("#tow").attr("class")获取ID为tow的class属性 $("#two").attr(&qu ...

  2. jq循环遍历元素的高度,判断超出显示更多按钮

    项目场景: jq循环遍历元素的高度,用于判断超出显示更多按钮然后点击展示全部,再次点击控制显示一行 问题描述: 第一步:jq循环遍历元素的高度: var divlist=$(".c-clas ...

  3. select(有局限性),jq循环添加select的值

    加载的时候改变select的默认值,只需改变select的value值 $("#one").val(@ViewBag.val);//@ViewBag.val是要默认选中的值的val ...

  4. input[type=checkbox] ; input[type=radio] 改变默认样式

    /*改变checkbox 默认样式*/input[type="checkbox"] { -webkit-appearance: none; /*清除复选框默认样式*/ height ...

  5. js改变style样式和css样式

    js可实现用户对页面中的选择条件改变页面中的样式,页面样式可以通过style修饰,也可以通过css修饰,先来看一下js改变style样式,代码如下: [html] view plaincopy < ...

  6. 改变dom样式的方法

    改变dom样式有两种做法,一种是通过domNode.style.xxx = "",给domNode加上内置样式,这种方式如果需要的样式比较多,就只好一个个增加,比较麻烦,还有一种方 ...

  7. JS 常用函数二(改变HTML样式)

    改变 HTML 样式 <!DOCTYPE html> <html> <head> <meta charset="utf-8"> &l ...

  8. jQuery基础 - 改变CSS样式

    本文转自:http://www.cnblogs.com/Capricornus/archive/2010/02/10/1667095.html,所有权利归原作者所有. jQuery提供css()的方法 ...

  9. jQuery中添加/改变/移除改变CSS样式例子

    在jquery中对于div样式操作我们会使用到CSS() removeClass() addClass()方法来操作了,下面我们就整理了几个例子大家一起来看看吧. CSS()方法改变CSS样式 css ...

最新文章

  1. 自动刷新某个指定网页
  2. 携程CEO称成功来自传统营销 B2C已经过时
  3. tuxedo相关概念
  4. python opencv 界面按钮_PyAutoGUI:自动化键鼠操作的Python类库
  5. 使用命令行对Android应用签名
  6. java数组随机抽取分布均匀_java利用数组随机抽取幸运观众
  7. synchronized 异常_由浅入深,Java 并发编程中的 Synchronized
  8. 【Python】Python简介和Python解释器
  9. opencv画框返回坐标 python_20行Python代码实现视频字符化
  10. SC2012 Orchestrator - 文档及资源链接
  11. atitit.解决struts2 SpringObjectFactory.getClassInstance NullPointerException
  12. 20170330今日头条笔试题
  13. 开放世界游戏中的大地图背后有哪些实现技术?
  14. 乒乓球十一分制比赛规则_乒乓球比赛规则
  15. 数据库系统实践 III 查询语句
  16. python 全栈开发,Day86(上传文件,上传头像,CBV,python读写Excel,虚拟环境virtualenv)
  17. IT行业岗位以及发展方向
  18. Taro跨端开发探索19——商城小程序确认订单页面开发
  19. 什么是JDK、JRE
  20. java获取u盘_读取U盘信息

热门文章

  1. 微信小程序——项目成员管理、小程序上传、发布步骤
  2. mysql怎么给数据加序号_Mysql 查询数据并按顺序添加序号
  3. 解决win10机械硬盘占用100%的方法(个人亲测有效)
  4. Command--Windows
  5. python实现qq登录腾讯视频_Python爬取腾讯视频评论的思路详解
  6. 视频剪辑软件,如何给视频添加自定义图片作为背景
  7. ftrack Review 双重校验
  8. 使用python和flask建个人博客---如何用给网站绑定域名
  9. Sql语句——单行注释与多行注释
  10. 联想重回聚光灯下,对国产品牌应该是好事