<!DOCTYPE html>

<html>

    <head>

        <meta charset="utf-8">

        <title></title>

        <style type="text/css">

            .top{

                float: left;

                margin-left: 22px;

                margin-top: 30px;

                height: 320px;

                width: 240px;

            }

            .top img{

                width: 100%;

                height: 100%;

            }

        </style>

    <body>

        <div class="top">

            <img class="tu1" src="../pic/1.jpg">

        </div>

    </body>

</html>

<script type="text/javascript">

    //1、先用js获取到div的内容

    document.getElementsByClassName('top').innerHTML;

    var re = "";

    var tu = 1;

    for (var i = 0; i < 9; i++) {

        tu++;

        re += '<div class="top">' +

            '<img class="tu1" src="../pic/'+tu+'.jpg">' +

            '</div>';

    }

    document.writeln(re);

</script>

html 复习（for循环不同内容的div）的更多相关文章

  1. 解决拖拽有内容的div的bug和兼容问题

    p.p1 { margin: 0.0px 0.0px 0.0px 0.0px; font: 31.0px Consolas; color: #2b7ec3 } p.p2 { margin: 0.0px ...

  2. C#5 复习总结循环 迭代和穷举

    一.章节复习: 循环.反复执行某段语句一种语法形式. 1.基本语法: for( 初始条件 ; 循环条件 ; 状态的改变 ) { 循环体 } 循环的四要素. 循环的执行过程.初始条件--循环条件--循环 ...

  3. 将展示内容（div、iframe）放在Expand控件中

    Expand是ArcGIS JavaScript API 4.3推出的一个widget(控件),用于承载一个HTML DOM元素,可以把一个自己编写的div或者是一个其他的Esri widget控件放 ...

  4. 用循环将三个DIV变成红色

    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/ ...

  5. JavaScript（八）——复习一（重要内容基本包含在内）

    一.常用对话框 1.alert(""):警告对话框,作用是弹出一个警告对话框 2.confirm(""):确定对话框,弹出一个带确定和取消按钮的对话框——确定返 ...

  6. 项目期复习总结2：Table， DIV+CSS，标签嵌套规则

    文件夹: 1.表格的意义,含义? 2.表格有哪些元素? 3.表格布局,表格布局的优缺点 4.行元素,块元素的差别? 5.标签的合理嵌套及标签的语义性 ① 表格的意义,含义? 表格应该用来展现那些适合表 ...

  7. JavaScript小练习3-用循环使三个DIV变色

    题目 初始为黑色,点击后为红色,再次点击为黑色,以后每次点击一次变色. 分析 简单的onclick使用. button的居中可以在外套一个p元素,body中让p居中即可. 三个DIV块的居中,使用ma ...

  8. CSS------当内容超出div宽度后自动换行

    <div class="AllReceivers-normal" style="widht:100%;height:100%;word-wrap: break-wo ...

  9. JavaSE复习日记 : 循环终止语句(break/break outerFor/continue)

    最近没网,但攒了几天的博客,这次逮到机会发博客,直接三篇走起; /* * 循环终止语句: break/ break outerFor/ continue */ /* * break语句 * 1. 用于 ...

随机推荐

  1. lightGBM gpu环境配置

    推荐先看一手官方的Installation Guide.我用的是ubuntu 16.04,一些要求如下图: 主要是OpenCL以及libboost两个环境的要求. (1) OpenCL的安装.我这里之 ...

  2. linux或者shell进入vi命令

    vi的基本操作 a) 进入vi     在系统提示符号输入vi及文件名称后,就进入vi全屏幕编辑画面: $ vi file  不过有一点要特别注意,就是您进入vi之后,是处于「命令行模式(comman ...

  3. Entity Framework 学习系列(1) - 认识理解Entity Framework

    目录 写在前面 什么是Entity Framework EF的优缺点 1.优点 2.缺点 如何理解ORM EF执行的原理 写在前面 在使用.net mvc 开发的时候.为了高效的开发,我们常常会搭配O ...

  4. xml文件操作帮助类

    xml文件的节点值获取和节点值设置 /// <summary> /// 保存单个点节点的值 /// </summary> /// <param name="Up ...

  5. 理解 Kubernetes 的亲和性调度

    这次给大家介绍下k8s的亲和性调度:nodeSelector.nodeAffinity.podAffinity.Taints以及Tolerations用法. 一般情况下我们部署的 POD 是通过集群自 ...

  6. Django的安全攻击

    目录 Django的安全攻击 XSS XSS(跨站脚本攻击) 危害 原理 防护 csrf(Cross Site Request Forgery) csrf(跨站域请求伪造) 过程 Django 提供的 ...

  7. 【转载】 使用宝塔Linux面板功能查看服务器内存使用情况

    运维过阿里云服务器或者腾讯云服务器的运维人员都知道,针对占用内存比较高的应用或者服务等,我们需要时刻关注服务器的内存使用率,是否存在内存瓶颈等情况的出现.阿里云和腾讯云官方后台界面的监控数据页面也有相 ...

  8. Vue学习之过滤器和自定义指令小结（三）

    过滤器: 过滤是一个数据经过了这个过滤之后出来另一样东西,可以是从中取得你想要的,或者给那个数据添加点什么装饰.过滤器就是过滤用的工具.渲染数据用的!!! 我们需要知道的是: 1.Vue中的过滤器不能 ...

  9. Python 常用语句

    条件语句 a=input("请输入数字a的值:\n") a=int(a) #从控制台接收到的都是字符串类型,需要转换 if a==0: #也可以写成if(a==0): print( ...

  10. FastJson--阿里开源的速度最快的Json和对象转换工具 https://www.cnblogs.com/kaituorensheng/p/8082631.html

    import java.util.ArrayList;import java.util.List;import java.util.HashMap;import java.util.Map; impo ...