封装一个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. jquery 使用attr() 函数对复选框无效的原因

     复选框是网站开发的时候经常用到的网页标签之一,常见的在页面上对复选框的操作包括取值和修改复选框的状态.在jquery中,常见的操作标签的值得函数为attr,然而在操作复选框的时候,通常采用的却是pr ...

  2. 关于Java集合

    之前关于java集合认识,虽然理解,但是总是忘记关键点,今明两天写一篇关于集合的随笔

  3. LeetCode 280. Wiggle Sort C#

    Given an unsorted array nums, reorder it in-place such that nums[0] <= nums[1] >= nums[2] < ...

  4. Table表格横竖线实现Css

    .tablel { border-collapse:collapse; /* 关键属性:合并表格内外边框(其实表格边框有2px,外面1px,里面还有1px哦) */ border:solid #999 ...

  5. 利用GCD实现单利模式的宏代码

    以下是.h文件,使用时,直接在需要实现单例模式的类中导入头文件即可. // .h文件 #define DenglSingletonH(name) + (instancetype)shared##nam ...

  6. java 生成证书用于https

    在jdk的bin目录下运行: keytool -genkeypair -alias "tomcat" -keyalg "RSA" -keystore " ...

  7. js变量,语句

  8. HTML下直接调用Less文件

    虽然有很多编译Less的插件可以使用 , 但是在开发的时候 , 每修改一次less代码就编译一次less文件 , 很明显效率就太低了 , 接下来为大家介绍一个直接在html的link标签中引入.les ...

  9. android 5.0 -- Activity 过渡动画

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

  10. jdbc连接数据库的步骤

    1.加载JDBC驱动程序: 在连接数据库之前,首先要加载想要连接的数据库的驱动到JVM(Java虚拟机), 这通过java.lang.Class类的静态方法forName(String  classN ...