热门标签 | HotTags
当前位置:  开发笔记 > 前端 > 正文

在js代码拼接dom对象到页面上去的模板总结(必看)

下面小编就为大家带来一篇在js代码拼接dom对象到页面上去的模板总结(必看)。小编觉得挺不错的,现在就分享给大家,也给大家做个参考。一起跟随小编过来看看吧

每次在js代码里面想动态的拼个dom,然后append到页面上,都是各种麻烦,

要是可以直接在jsp页面弄个隐藏的model那是很好的,用js方法里面的clone方法也是很好的,还可以给不同部分set值。

为了以后简单点,我就把模板摆着,方便后面用得着的时候,复制粘贴。

function fillDialog(dataArray) {
  var target = $("#dialogTarget");
  target.empty();
  for (var i = 0; i ');
    label.text("" + dataArray[i].channelName);
    var input = $("");
    input.prop("name", "checkbox");
    input.prop("type", "checkbox");
    input.prop("value", dataArray[i].id);
    if (dataArray[i].showInUserStatistic) {
      input.prop("checked", "true");
    }
    label.prepend(input);
    target.append(label);
  }
}
var trs = "";
  for (var i = 0; i  0) {
      //去分行活跃用户数的小数部分如:11.0 ---> 11
      activeUser = activeUser.substring(0, index);
    }
    trs += "" + branchBank + "";
    trs += "" + newUser + "";
    trs += "" + netBoostUser + "";
    trs += "" + closeUser + "";
    trs += "" + activeUser + "";
    trs += "";
  }
  newList.append("" + trs + "");
  tableChart.append(newList.show());

 var $metric = $("#metric");
 $metric.empty();
 var optGroup0 = $("");
 var optGroup1 = $("");
 var optGroup2 = $("");

 for(var i=0; i");
  option.attr("value", m.metric);
  option.attr("data_type", m.data_type);
  option.attr("unit", m.unit);
  option.html(m.title);
  if (m.groupType == 0) {
  optGroup0.append(option);
  } else if (m.groupType == 1) {
  optGroup1.append(option);
  } else {
  optGroup2.append(option);
  }
   }
  }
 $metric.append(optGroup0);
 $metric.append(optGroup1);
 $metric.append(optGroup2);
  if(metric != undefined){
 $metric.val(metric);
  }
 $metric.trigger("chosen:updated");

function fillRecoveryTable(data) {
  var $tableBody = $("#recoveryTable").find("tbody");
  $tableBody.empty();
  var trs = "";
  for (var i = 0; i ";
    trs += "" + recovery.timeString + "";
    trs += "" + (recovery.result ? "成功" : "失败") + "";
    trs += "" +
      "" +
      "";
    trs += "";
  }
  $tableBody.append(trs);
}

以上这篇在js代码拼接dom对象到页面上去的模板总结(必看)就是小编分享给大家的全部内容了,希望能给大家一个参考,也希望大家多多支持。


推荐阅读
  • 本文详细介绍了如何使用 CSS3 的 background-clip 和 background-origin 属性来裁剪和定位背景图片,以及如何通过 background-size 控制背景图片的尺寸。 ... [详细]
  • 本文介绍了三种解决 Git Push 冲突的方法,包括创建新分支、手动解决冲突和强行推送。这些方法适用于不同的开发场景,如版本迭代、多人协作和个人开发。 ... [详细]
  • 本文探讨了 Java 中 HttpClient 和 HtmlUnit 的区别,重点介绍了它们的功能和应用场景。 ... [详细]
  • 本文介绍了如何使用Aspose库将Office文件(如Word、PowerPoint)转换为HTML文件,并详细说明了在转换过程中可能出现的乱码问题及其解决方案。 ... [详细]
  • JSP(JavaServer Pages)和Servlet都是Java Web开发中的重要技术。JSP可以看作是Servlet的扩展,主要关注页面的展示效果。而Servlet则更侧重于处理业务逻辑。本文将详细介绍它们的相同点和不同点。 ... [详细]
  • 本文探讨了为何产品团队提出的某些需求在研发完成后未能获得用户的认可,并提供了改进方法。主要分析了功能不完整或存在bug以及用户体验不佳的原因。 ... [详细]
  • 申请地址:https://developer.apple.com/appstore/contact/?topic=expedite 常见申请理由:1. 我们即将发布新产品,这是一个媒体活动,我们无法承担任何风险,因此在多个方面努力提升应用质量。 ... [详细]
  • 近年来,区块链技术备受关注,其中比特币(Bitcoin)功不可没。尽管数字货币的概念早在上个世纪就被提出,但直到比特币的诞生,这一概念才真正落地生根。本文将详细探讨比特币、以太坊和超级账本(Hyperledger)的核心技术和应用场景。 ... [详细]
  • 本文详细介绍了后缀表达式的求值方法及其转换过程。后缀表达式,又称逆波兰表达式,通过栈结构可以高效地进行求值。同时,文章还提供了中缀表达式转后缀表达式的具体步骤和实例解析。 ... [详细]
  • 使用外部样式表实现盒子居中对齐
    本文介绍如何在HTML文件中引入外部CSS样式表,并通过CSS实现盒子的居中对齐。 ... [详细]
  • 【转】强大的矩阵奇异值分解(SVD)及其应用
    在工程实践中,经常要对大矩阵进行计算,除了使用分布式处理方法以外,就是通过理论方法,对矩阵降维。一下文章,我在 ... [详细]
  • 本文将介绍如何利用Python从西门子PLC获取数据,并通过Web技术实现数据的可视化。我们将探讨所需的技术栈和具体步骤。 ... [详细]
  • Python学习day3网络基础之网络协议篇
    一、互联网协议连接两台计算机之间的Internet实际上就是一系列统一的标准,这些标准称之为互联网协议,互联网的本质就是一系列网络协议。二、为什么要有互联网协议互联网协议就相当于计 ... [详细]
  • 本文介绍了如何使用线段树实现区间加法和区间查询操作,包括详细的代码实现和解释。 ... [详细]
  • 使用 Mui.js 获取复选框值的方法
    本文介绍如何使用 Mui.js 框架来获取复选框的值,并通过数组进行处理和展示。 ... [详细]
author-avatar
陈艹桂肀琰
这个家伙很懒,什么也没留下!
PHP1.CN | 中国最专业的PHP中文社区 | DevBox开发工具箱 | json解析格式化 |PHP资讯 | PHP教程 | 数据库技术 | 服务器技术 | 前端开发技术 | PHP框架 | 开发工具 | 在线工具
Copyright © 1998 - 2020 PHP1.CN. All Rights Reserved | 京公网安备 11010802041100号 | 京ICP备19059560号-4 | PHP1.CN 第一PHP社区 版权所有