var DS;
DS = CallIVRAjaxClass.GetBranchCallCount().value;
var obj = {};
obj.branch = "_branch";
obj.count = "_count";
if (DS != null && typeof (DS) == "object" && DS.Tables != null) {
if (DS.Tables[0].Rows.length > 0) {
for (var i = 0; i < DS.Tables[0].Rows.length; i++) { var MapDiv = document.getElementById("MapDiv");
var MapImg = document.createElement("img");//开始创建一个img标签
MapImg.name = "imgMap";//开始赋值一些必要属性,其中alt和src必须要有
MapImg.alt = "";
MapImg.src = "";
MapImg.style.position = "absolute";//由于我是用于图片叠加,所以用了绝对定位,
MapDiv.appendChild(MapImg);//将这个创建好的追加到div容器里面 var _count = DS.Tables[0].Rows[i][obj.count]; //去处当前obj.count值的数据
var ImagePath = "image/" + DS.Tables[0].Rows[i][obj.branch] + "_"; //提前设置好路径和图片前半部分的名字
var _Map = document.getElementsByName("imgMap")[i]; //根绝name值找到当前img标签

              //下面判断当前取出来的值来确定图片。注:png格式才可以有透明属性
var str = "";
if (_count == 0) {
//_Map.src = ImagePath +
str = i + ".png";
} else if (_count >= 1 && _count <= 5) { str = i + ".png"; } else if (_count >= 6 && _count <= 10) {
str = i + ".png"; } else if (_count >= 11 && _count <= 20) {
str = i + ".png"; } else if (_count >= 21 && _count <= 30) {
str = i + ".png"; } else {
str = i + ".png"; } // //测试留
// str = ""; _Map.src = ImagePath + str;//循环给img标签src属性值,由于我要放的图片是部分透明的,所有叠加在一起是刚刚好
}
}
}

  

js如何动态创建一个新的标签的更多相关文章

  1. JS动态引入js,CSS——动态创建script/link/style标签

    一.动态创建link方式 我们可以使用link的方式.如下代码所示. 二.动态创建style方式 但是,这样的话,需要加载整个css文件,但是那样有可能浪费一个http请求并占用一个服务器请求数,并等 ...

  2. Node.js实战1:创建一个新的Node项目。

    你也许在猜专业的Node开发如何创建一个新项目. 有Npm在 ,这会非常简单. 虽然你可以创建一个JS文件,并执行:node file.js,但我建议你使用npm init来先创建一个node项目,这 ...

  3. js如何动态创建表格(两种方法)

    js如何动态创建表格(两种方法) 一.总结 一句话总结: 1.方法一:写好创建表格的html代码,将之赋值给div的innerHTML. 2.方法二.直接用创建好的table元素的方法insertRo ...

  4. 创建一个新的解耦的Orchard Core CMS网站

    引言本文将介绍创建一个功能齐全.解耦的CMS网站的过程,该网站允许您编辑博客帖子并呈现它们.解耦是一种开发模型,其中站点的前端和后端(管理)托管在同一个Web应用程序中,但只有后端由CMS驱动.然后, ...

  5. Eclipse中创建一个新的SpringBoot项目

    在Eclipse中创建一个新的spring Boot项目: 1. 首先在Eclipse中安装STS插件:在Eclipse主窗口中点击 Help -> Eclipse Marketplace... ...

  6. 第六周分析Linux内核创建一个新进程的过程

    潘恒 原创作品转载请注明出处<Linux内核分析>MOOC课程http://mooc.study.163.com/course/USTC-1000029000 task_struct结构: ...

  7. cocos2dx 3.x版本搭建Mac环境工程(创建一个新的C++工程)百分百可行

    首先第一篇,想学cocos2dx第一步就是搭建环境,第一步搭建不了环境,创建不了工程那一切都是扯淡. 说到mac下安装cocos2d-x想到的模式就是xcode+cocos2d-x.因为我本身就是一个 ...

  8. 实验 六:分析linux内核创建一个新进程的过程

    实验六:分析Linux内核创建一个新进程的过程 作者:王朝宪  <Linux内核分析>MOOC课程http://mooc.study.163.com/course/USTC-1000029 ...

  9. Python tricks(1) -- 动态定义一个新变量

    python是动态语言, 无需声明变量即可使用. 传递一个tuple, list或者dict等等方式, 有时候这种方式的使用不是很好. 对于tuple和list来说都是用下标的访问方式(即使用[]), ...

随机推荐

  1. iptables基础原理和使用简介

    概念简介 名称 Netfilter/iptables模块有两部分组成: Netfilter框架以及iptables,iptables又分为iptables(内核空间)和iptables命令行工具(用户 ...

  2. 快进来!花几分钟看一下 ReentrantReadWriteLock 的原理!

    前言 在看完 ReentrantLock 之后,在高并发场景下 ReentrantLock 已经足够使用,但是因为 ReentrantLock 是独占锁,同时只有一个线程可以获取该锁,而很多应用场景都 ...

  3. Activit的心路历程:获取当前节点的上一节点【可能存在多个】的nodeId

    在我的开发任务中,突然给我提出了一个待办任务需要获取当前任务节点上以任务节点的表单信息,刚开始搞得我有点措手不及,后来仔细是靠后,灵感一下,直接操作流程的bpmn信息就可以获取到节点信息嘛,顺着这个思 ...

  4. 痞子衡嵌入式:RT-UFL - 一个适用全平台i.MXRT的超级下载算法设计

    大家好,我是痞子衡,是正经搞技术的痞子.今天给大家带来的是痞子衡的开源项目 RT-UFL. 痞子衡在近两年多的i.MXRT客户项目支持过程中,遇到的一个相当高频的问题就是制作i.MXRT下载算法.我们 ...

  5. Spring Cloud 纯干货,从入门到实战

    导读 之前写过一篇SpringCloud从入门到精通的点我直达,微服务基础知识点我直达,今天我们使用Spring Cloud模拟一个电商项目.分别有以下2个服务,商品.订单.下面我们开始叭 技术栈 S ...

  6. leetcode128-generate-parentheses

    题目描述 给出n对括号,请编写一个函数来生成所有的由n对括号组成的合法组合. 例如,给出n=3,解集为: "((()))", "(()())", "( ...

  7. 力扣 - 146. LRU缓存机制

    目录 题目 思路 代码 复杂度分析 题目 146. LRU缓存机制 思路 利用双链表和HashMap来解题 看到链表题目,我们可以使用头尾结点可以更好进行链表操作和边界判断等 还需要使用size变量来 ...

  8. UNP——第三章,套接字编程介绍

    1.套接字结构 多数套接字函数都有套接字结构参数,每个协议族都定义了自己的套接字结构,以 sockaddr_ 开始,并对应协议族的唯一后缀. struct sockaddr_in { uint8_t ...

  9. NO.A.0009——day04——idea的安装及配置教程

    概述: 集成开发环境:IDE.开发工具Integrated Development Environment,IDE, 1.如果自己手洗衣服: 1. 准备一盆水 2. 放入衣服浸泡30分钟 3. 搓洗衣 ...

  10. mysql之冷备和mysqldump、mydumper、xtrabackup备份

    1.冷备流程: 停库备份,冷备份一般用于非核心业务,这类业务一般都允许停库. 在停止数据库后,将数据文件拷贝出来,然后对原始数据文件进行备份. 流程: 1.关闭数据库备份          2.拷贝数 ...