封装一个DivTag,在页面加载的时候自动执行。用于创建任意的DOM节点,并且可以追加到任意的DOM节点上,可以设置样式,添加文本。
var element = {
__init__: function ( tagName ) {
//创建DOM标签
this.DOM = document.createElement( tagName );
},
//追加到dom节点上
appendTo: function ( node ) {
//如果是节点
if ( node.nodeType ) {
node.appendChild( this.DOM );
} else if ( node.DOM ) {
//如果是DivTag
node.DOM.appendChild( this.DOM );
}
return this;
},
//设置文本
html: function ( str ) {
this.DOM.innerHTML = str;
return this;
},
//设置样式
css: function ( option ) {
for ( var k in option ) {
this.DOM.style[ k ] = option[ k ];
}
return this;
},
//添加节点
add: function ( node ) {
if ( node.nodeType ) {
this.DOM.appendChild( node );
} else if ( node.DOM ) {
this.DOM.appendChild( node.DOM );
}
return this;
}
}; //创建一个div标签
function DivTag() {
this.__init__( 'div' );
}
//修改DivTag原型,给原型重新赋值,使原型具有该方法
DivTag.prototype = element;
//创建一个p标签
function PTag() {
this.DOM = document.createElement( 'p' );
}
//使p节点同样可以继承该方法
PTag.prototype = element; onload = function() {
new DivTag()
.html( '你好啊' )
.add( new PTag().html( '我是 p 标签' ) )
.css( {
border: '1px dashed red'
} )
.appendTo( document.body );
}

封装一个DivTag的更多相关文章

  1. 自己封装一个Log模块

    Unity自己有log系统,为什么要自己封装一个 1.不好用,只能在pc上记录log文件,移动平台是没有的 2.在开发时期的log,不想在正式版里面出现.没有一个统一的开关来控制是不是要显示log,要 ...

  2. PHP封装一个通用好用的文件上传处理类

    封装一个文件上传类完成基本功能如下: 1.可上传多个或单个文件 2.上传成功返回一个或多个文件名 3.上传失败则返回每个失败文件的错误信息 上传类中的基本功能: 1.构造参数,用户可以自定义配置参数, ...

  3. Swift - 简单封装一个工具类模板

    创建模板类(封装一个类) 例1:新建一个名字叫做 Product 的类 Product.swift File 的内容 class Product { var name: String var desc ...

  4. 使用xib封装一个自定义view的步骤

    使用xib封装一个自定义view的步骤 1> 新建一个继承UIView的自定义view,假设类名叫做(MJAppView) 2> 新建一个MJAppView.xib文件来描述MJAppVi ...

  5. yii2封装一个类控制div宽度,高度

    1.首先,封装一个类,放在文件夹vendor下,命名为articls.php. <?phpclass Articles{ //测试    function add()    {        r ...

  6. C 封装一个简单二叉树基库

    引文 今天分享一个喜欢佩服的伟人,应该算人类文明极大突破者.收藏过一张纸币类型如下 那我们继续科普一段关于他的简介 '高斯有些孤傲,但令人惊奇的是,他春风得意地度过了中产阶级的一生,而  没有遭受到冷 ...

  7. IOS中封装一个View的思路

    一.封装一个View的思路 1.将View内部的业务逻辑(显示内容)封装到View中 2.一般情况下,View的位置应该由父控件来决定,也就是位置不应该固定死在View内部 3.至于View的宽高,根 ...

  8. 使用libzplay库封装一个音频类

    装载请说明原地址,谢谢~~      前两天我已经封装好一个duilib中使用的webkit内核的浏览器控件和一个基于vlc的用于播放视频的视频控件,这两个控件可以分别用在放酷狗播放器的乐库功能和MV ...

  9. 简易封装一个带有占位文字的TextView

    在实际iOS应用开发中我们经常会用到类似于下图所示的界面,即带有占位文字的文本框:

随机推荐

  1. Centos7 安装高版本php

    1. 配置yum源 查看yum源的链接是不是有效的.可以参考此链接  https://webtatic.com/projects/yum-repository/ # rpm -Uvh http://f ...

  2. 《Intel汇编第5版》 Mov指令

    一.Mov用于数据传送,用法如下: 二.当传送的数据和目标数据位宽不一致的时候,需要使用MOVZX.MOVSX扩展.MOVZX使用0填充高位,MOVSX使用源操作数最高位填充 下面是汇编代码演示: I ...

  3. SAP HANA 能做什么

    HANA不是一个数据仓库,而是一个平台,在这个平台之上用户可以构建数据仓库或集市.报表和仪表盘等. HANA能做的,首先是作为内存数据库,提供数据插入.修改和高效的查询功能. 其次,作为一个平台,在H ...

  4. 3天CSS总结

    css的重点和难点是盒子模型中的margin.padding.border.属性,还有浮动也是重点.

  5. Edward's Cola Plan

     Edward's Cola Plan Time Limit:3000MS     Memory Limit:32768KB     64bit IO Format:%lld & %llu S ...

  6. 【Python之路】第八篇--Python基础之网络编程

    Socket socket通常也称作"套接字",用于描述IP地址和端口,是一个通信链的句柄,应用程序通常通过"套接字"向网络发出请求或者应答网络请求. sock ...

  7. 中小型公司数据仓库搭建——以mysql为例

    为了方便公司的数据分析平台的独立运行和数据挖掘的探索,今年上半年在公司搭建了支持数据平台和数据挖掘的数据仓库:现就数据仓库的创建工作总结如下,供大家参考: 首先介绍下数据仓库搭建的缘由: 公司创建两年 ...

  8. ramfs/tmpfs: Linux RAM filesystems

    Previously in windows, I uses ramdisk, to accelerate chrome browsing. However, in linux, this is mad ...

  9. 导航栏底部黑线隐藏 UINavigationBar hidden Bottom Line

    3种方法: 1.大杀器  ,iOS 10.2 最新系统亲测无问题( 添加导航栏分类) https://github.com/samwize/UINavigationBar-Addition/ 2.io ...

  10. android 5.0 -- Activity 过渡动画

    android 5.0 提供3种过渡动画: 进入 退出 进入退出包括如下效果: explode 分解:屏幕中间进出 slide 滑动:屏幕边缘进出 fade 淡出:改变透明度来添加或者移除视图 共享 ...