<!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. vue的package.json文件理解

    参考文档: https://www.cnblogs.com/tzyy/p/5193811.html#_h1_0 https://www.cnblogs.com/hongdiandian/p/83210 ...

  2. 获取Excel

    默认Excel文档为 代码如下   需要下载  "EPPlus.Core" var file = Directory.GetCurrentDirectory() + "\ ...

  3. 千万不要用window自带文本编辑器编辑配置文件或者代码

    1 引言 用windows自带的text文本在最前面会带入看不到的BOM,导致异常 2 代码 package main import ( "strings" "fmt&q ...

  4. Spring Boot 企业级应用开发实战 刘伟东-2018年3月第一版

    Spring会自动搜索某些路径下的Java类 并将这些类注册微Bean实例,这样就省去了所有Bean都配置在XML的麻烦 Spring会适当地将显示指定路径下的的类全部注册微Spring Bean . ...

  5. 使用 HttpWebRequest 类做 POST 请求没有应反

    这几天给系统做第三方集成, 需要调用另一个软件的一个接口, 通过 HTTP 的方式调用,调用代码也挺简单的: string serviceUrl = string.Format("{0}/{ ...

  6. English--定语从句

    English|定语从句 从介绍从句开始,英语的句子已经开始逐渐复杂了!做好心理准备,三大从句介绍完毕,会介绍分词短语.废话不多说,直接开始干! 前言 目前所有的文章思想格式都是:知识+情感. 知识: ...

  7. Vue学习之生命周期钩子小结（四）

    一.生命周期钩子(函数): 1.每个 Vue 实例在被创建时都要经过一系列的初始化过程——例如,需要设置数据监听.编译模板.将实例挂载到 DOM 并在数据变化时更新 DOM 等.同时在这个过程中也会运 ...

  8. Spring容器的refresh()介绍

    Spring容器的refresh()[创建刷新]; 1.prepareRefresh()刷新前的预处理; 1).initPropertySources()初始化一些属性设置;子类自定义个性化的属性设置 ...

  9. ip协议栈

    struct iphdr { #if defined(__LITTLE_ENDIAN_BITFIELD) __u8 ihl:4, version:4; #elif defined (__BIG_END ...

  10. Python数据预处理之清及

    使用Pandas进行数据预处理 数据清洗中不是每一步都是必须的,按实际需求操作. 内容目录 1.数据的生成与导入 2.数据信息查看 2.1.查看整体数据信息 2.2.查看数据维度.列名称.数据格式 2 ...