一个简单的创建dom的函数
var regName = /^(div|a|p|ul|li|input|select|document|body|iframe)$/;
function createDom(name, obj) {
var match = regName.exec(name),
dom;
if (match && match[1]) {
dom = document.createElement(match[1]);
}
if (dom.nodeType && dom.nodeType == 1) {
for (var i in obj) {
var match = i.split(/\./);
var len = match && match.length || 0;
if (len == 1) {
dom[match[0]] = obj[i];
} else if (len == 2) {
dom.style[match[1]] = obj[i];
}
}
}
return dom;
}
调用方法示例
var newdom = createDom("input", {
"className": "alertInput data",
"type": "text",
"value":"123",
"style.width":"100px"
});
createDom("div", {
"className": "_div",
"id": "test",
"style.cssText": "margin:0;padding:0;position:fixed;top:0;left:0"
})
一个简单的创建dom的函数的更多相关文章
- 实现一个简单的虚拟DOM
现在的流行框架,无论React还是Vue,都采用虚拟DOM. 好处就是,当我们数据变化时,无需像Backbone那样整体重新渲染,而是局部刷新变化部分,如下组件模版: <ul class=&qu ...
- 一个简单的增强型PHP curl函数
啥都不说,先上代码 <?PHP /* * @author 小伍 */ echo "<pre>"; $proxy = array('url'=>'http:/ ...
- 一个简单的js实现倒计时函数
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/ ...
- 一个简单的金额平均分配函数(C#版)
//总金额平均分配给总人数 //参数说明:总金额,总人数,最大金额为平均金额的倍率 public double[] GetList(double zje,int zrs,int max) { doub ...
- 一个简单的创建圆角图像的UIImage扩展实现
- (UIImage *)roundedCornerImageWithCornerRadius:(CGFloat)cornerRadius { CGFloat w = self.size.width; ...
- uiautomator 一个简单脚本创建流程
http://www.codeceo.com/article/android-ui-auto-test.html
- 一个简单的创建xml方式
, matnr LIKE mara-matnr , maktx LIKE makt-maktx , END OF itab_matnr . , class LIKE m_wwgha-class,&qu ...
- Vue.js源码解析-Vue初始化流程之动态创建DOM
目录 前言 一._update 如何判断是初始化还是更新操作? 二.patch 2.1 patch 定义 2.2 初始化的 patch 三.createElm 动态创建DOM 3.1 创建组件节点 3 ...
- js new一个对象的过程,实现一个简单的new方法
对于大部分前端开发者而言,new一个构造函数或类得到对应实例,是非常普遍的操作了.下面的例子中分别通过构造函数与class类实现了一个简单的创建实例的过程. // ES5构造函数 let Parent ...
随机推荐
- 十二周项目三(4)——出口fibnacci第一序列20的数量
/* * Copyright (c) 2014, 烟台大学计算机学院 * All rights reserved. * 文件名:test.cpp * 作者:陈丹妮 * 完毕日期:2014年 11 月 ...
- Java的进程内缓存框架:EhCache (转)
EhCache 是一个纯Java的进程内缓存框架,具有快速.精干等特点,是Hibernate中默认的CacheProvider. Ehcache缓存的特点: 1. 快速. 2. 简单. 3. 多种缓存 ...
- 学习英语每日一 On the house. 赠品
tp=webp" alt=""> On the house. 免费赠送.我们之前学过请客能够说I'll buy you something. 事实上还有一种说法是I ...
- 8年,属于 HTML 5 春天的到来悄悄!
[核心提示] 在 8 年时间中,HTML 5 为整个行业都带来了什么.标准终于确定后又会产生什么样的变革呢? 微博微信Twitter对于非常多人来说,非常有可能在微信的朋友圈里玩过「围住神经猫」,也非 ...
- 软测试综述——PV操作
在操作系统中,进程之间常常会存在相互排斥(都须要共享独占性资源时)和同步(完毕异步的两个进程的协作)两种关系.而信号量和PV操作完美有效的处理了这两种情况. 相互排斥:就好比过独木桥,一 ...
- 中国澳门sinox很多平台CAD制图、PCB电路板、IC我知道了、HDL硬件描述语言叙述、电路仿真和设计软件,元素分析表
中国澳门sinox很多平台CAD制图.PCB电路板.IC我知道了.HDL硬件描述语言叙述.电路仿真和设计软件,元素分析表,可打开眼世界. 最近的研究sinox执行windows版protel,powe ...
- POJ1080 Human Gene Functions 动态规划 LCS的变形
题意读了半年,唉,给你两串字符,然后长度不同,你能够用'-'把它们补成同样长度,补在哪里取决于得分,它会给你一个得分表,问你最大得分 跟LCS非常像的DP数组 dp[i][j]表示第一个字符串取第i个 ...
- HDU 1505 Largest Rectangle in a Histogram && HDU 1506 City Game(动态规划)
1506意甲冠军:给你一个连续的直方图(拼贴底部长度1).求连续基质区. 对每一个直方图,分别向左向右进行扩展. #include<cstdio> #include<stdlib.h ...
- Java多线程的~~~synchronized加入参数,以实现独立片段
有时候,我们不希望在整个方法的前面加上synchronized这个keyword.这将使整个方法调用变得缓慢,我们只是重点 代码的地方添加这个synchronized这个keyword,然后这样就能加 ...
- DevExpress XtraReports 入门二 创建 data-aware(数据感知) 报表
原文:DevExpress XtraReports 入门二 创建 data-aware(数据感知) 报表 本文只是为了帮助初次接触或是需要DevExpress XtraReports报表的人群使用的, ...