js如何动态创建一个新的标签
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如何动态创建一个新的标签的更多相关文章
- JS动态引入js,CSS——动态创建script/link/style标签
一.动态创建link方式 我们可以使用link的方式.如下代码所示. 二.动态创建style方式 但是,这样的话,需要加载整个css文件,但是那样有可能浪费一个http请求并占用一个服务器请求数,并等 ...
- Node.js实战1:创建一个新的Node项目。
你也许在猜专业的Node开发如何创建一个新项目. 有Npm在 ,这会非常简单. 虽然你可以创建一个JS文件,并执行:node file.js,但我建议你使用npm init来先创建一个node项目,这 ...
- js如何动态创建表格(两种方法)
js如何动态创建表格(两种方法) 一.总结 一句话总结: 1.方法一:写好创建表格的html代码,将之赋值给div的innerHTML. 2.方法二.直接用创建好的table元素的方法insertRo ...
- 创建一个新的解耦的Orchard Core CMS网站
引言本文将介绍创建一个功能齐全.解耦的CMS网站的过程,该网站允许您编辑博客帖子并呈现它们.解耦是一种开发模型,其中站点的前端和后端(管理)托管在同一个Web应用程序中,但只有后端由CMS驱动.然后, ...
- Eclipse中创建一个新的SpringBoot项目
在Eclipse中创建一个新的spring Boot项目: 1. 首先在Eclipse中安装STS插件:在Eclipse主窗口中点击 Help -> Eclipse Marketplace... ...
- 第六周分析Linux内核创建一个新进程的过程
潘恒 原创作品转载请注明出处<Linux内核分析>MOOC课程http://mooc.study.163.com/course/USTC-1000029000 task_struct结构: ...
- cocos2dx 3.x版本搭建Mac环境工程(创建一个新的C++工程)百分百可行
首先第一篇,想学cocos2dx第一步就是搭建环境,第一步搭建不了环境,创建不了工程那一切都是扯淡. 说到mac下安装cocos2d-x想到的模式就是xcode+cocos2d-x.因为我本身就是一个 ...
- 实验 六:分析linux内核创建一个新进程的过程
实验六:分析Linux内核创建一个新进程的过程 作者:王朝宪 <Linux内核分析>MOOC课程http://mooc.study.163.com/course/USTC-1000029 ...
- Python tricks(1) -- 动态定义一个新变量
python是动态语言, 无需声明变量即可使用. 传递一个tuple, list或者dict等等方式, 有时候这种方式的使用不是很好. 对于tuple和list来说都是用下标的访问方式(即使用[]), ...
随机推荐
- 10万用户一年365天的登录情况如何用redis存储,并快速检索任意时间窗内的活跃用户
1.redsi的bitmap数据结构介绍 bitmap本质上是一个string类型,只是他操作的是string的某个位是0还是1. setbit和getbit 两条命令是对字符串的位操作.每个位只能是 ...
- Java_流相关
java.io包中重要的5个类3个接口 类名 说明 File 文件类 InputStream 字节流输入 OutputStream 字节流输出 Reader 字符输入流 Writer 字符输出流 Cl ...
- 常用的Linux命令,日常收集记录
1.# yum install -y xxxx 解释:install代表往系统中安装一个或者多个软件包:-y 代表回答全部问题为是 2.# ps -ef | grep yum (根据进程名来查看进 ...
- 在pgsql库用触发器自动触发PostgreSQL的存储过程,实现插入。
需求:在对表A 执行 insert操作时,筛选符合条件的数据 insert到表B中,编写为存储过程(postgreSQL数据库) [筛选条件]:1. dd !="A" 或是 dd为 ...
- 服务器断电导致的ORACLE异常 : ORA-00214 ORA-01033 ORA-01034 ORA-00172 ORA-27101
工作环境中的集群迁移之后,oracle出了挺多问题,最开始一直没找到原因,后来发现做迁移的人是冷迁移的,且数据库节点是硬关机的,惊了( 表现症状有不能登陆,登录了不能操作等 第一个报的是 ORA-00 ...
- Spider_基础总结5--动态网页抓取--元素审查--json--字典
# 静态网页在浏览器中展示的内容都在HTML的源码中,但主流网页使用 Javascript时,很多内容不出现在HTML的源代码中,此时仍然使用 # requests+beautifulsoup是不能够 ...
- JS缓冲运动案例
点击"向右"按钮,红色的#red区块开始向右缓冲运动,抵达到黑色竖线位置自动停止,再次点击"向右"#red区块也不会再运动.点击"向左"按钮 ...
- 采用“传统”方式获取当前HttpContext
我们知道"依赖注入"已经成为了.NET Core的基本编程模式,表示当前请求上下文的HttpContext可以通过注入的IHttpContextAccessor服务来提取.有时候我 ...
- MySql Binlog 说明 & Canal 集成MySql的更新异常说明 & MySql Binlog 常用命令汇总
文章来源于本人的印象笔记,如出现格式问题可访问该链接查看原文 原创声明:作者:Arnold.zhao 博客园地址:https://www.cnblogs.com/zh94 目录 背景介绍 开启MySq ...
- python学习手册.first
# 1.注释 # 行注释 # # print('****') # 多行注释三个双引号或者单引号 '''print('****') pri ...