Bootstrap段落(正文文本)
工厂模式介绍
将new操作符单独进行封装,遇到new时,就要考虑是否该使用工厂模式
举一个生活当中的示例:
你要去购买汉堡,直接点餐,取餐,不会自己动手做,商店要“封装” 做汉堡的工作,做好直接给购买者,而不是商店给你面粉,工具让你自己去做
UML类图和代码示例
class Product {
constructor (name){
this.name = name
}
init () {
console.log(`init:${this.name}`)
}
fn () {
console.log(`fn:${this.name}`)
}
} class Creator {
create (name) {
return new Product(name)
}
} // 测试
let creator = new Creator()
let p1 = creator.create('p1')
p1.init()
p1.fn()
设计原则验证
构造函数和创建者分离,符合开放封闭原则
场景示例
jQuery - $('div')
Jquery就是工厂模式,向外面暴露一个方法,方法返回一个JQuery对象
class jQuery {
constructor(seletor) {
let slice = Array.prototype.slice
let dom = slice.call(document.querySelectorAll(seletor))
let len = dom ? dom.length : 0
for(let i = 0; i < len; i++){
this[i] = dom[i]
}
this.length = len
this.seletor = seletor || ''
}
append(node){ }
addClass(name){ }
html(data){ }
}
window.$ = function (selector) {
// 工厂模式
return new jQuery(selector)
} // 测试代码
var $p = $('p')
console.log($p)
console.log($p.addClass)
React.createElement(创建虚拟DOM对象的方法)
// 创建虚拟DOM对象
const vDom1 = React.createElement('h1', {id: myId.toLowerCase()}, msg.toUpperCase()) //渲染虚拟DOM
ReactDOM.render(vDom1, document.getElementById('test1'))
vue异步组件
Bootstrap段落(正文文本)的更多相关文章
- bootstrap之强调文本的类(带颜色)
bootstrap之强调文本的类(带颜色) <small>本行内容是在标签内</small><br> <strong>本行内容是在标签内</str ...
- 【译】在Asp.Net中操作PDF – iTextSharp -利用块,短语,段落添加文本
原文 [译]在Asp.Net中操作PDF – iTextSharp -利用块,短语,段落添加文本 本篇文章是讲述使用iTextSharp这个开源组件的系列文章的第三篇,iTextSharp可以通过As ...
- 基于bootstrap的富文本框——wangEditor【欢迎增加开发】
先来一张效果图: 01. 引言 老早就開始研究富文本框的东西,在写完<深入理解javascript原型与闭包>之后,就想着要去做一个富文本框的插件的样例. 如今网络上开源的富文本框插件许多 ...
- Bootstrap 斜体、文本对齐、缩略图、地址、列表等
目录1.标题2.页面主体3.强调 a.小号文本 b.着重 c.斜体 d.对齐class e.强调class4.缩略语5.地址6.列表 a.无序列表 b.有序列 ...
- Bootstrap系列 -- 4. 文本内容强调
一. 文本强调基本样式 .text-muted:提示,使用浅灰色(#999) .text-primary:主要,使用蓝色(#428bca) .text-success:成功,使用浅绿色(#3c763d ...
- Bootstrap系列 -- 16. 文本域textarea
文本域和原始使用方法一样,设置rows可定义其高度,设置cols可以设置其宽度.但如果textarea元素中添加了类名“form-control”类名,则无需设置cols属性.因为Bootstrap框 ...
- 【回顾】html属性、标题、段落、文本格式化
1.HTML 属性 HTML 元素可以设置属性 属性可以在元素中添加附加信息 属性一般描述于开始标签 属性总是以名称/值对的形式出现,比如:name="value". HTML 提 ...
- 【WEB基础】HTML & CSS 基础入门(3)段落及文本
写在前面:CSS选择器 网页要显示很多内容,想要为每个内容设置不同的样式,我们就得首先选中要设置样式的内容,CSS选择器就是指明该样式是针对HTML里哪一个元素的.简单的例子,网页上有几段文字,我们想 ...
- HTML(二)属性,标题,段落,文本格式化
HTML属性 HTML属性 HTML 元素可以设置属性 属性可以在元素中添加附加信息 属性一般描述于开始标签 属性总是以名称/值对的形式出现,比如:name="value" 常用属 ...
随机推荐
- htmlnav
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8&quo ...
- winform——绑定DataGridView
==========================================================================================重点需要掌握==Au ...
- 利用Session实现一次验证码
Session可避免表单的重复提交:实现一次表单提交,可避免恶意提交: 1.首先建立一个Servlet类:ValidateColorServlet,里边有获取验证码的方法,并且验证码是大小写区分: p ...
- 周赛-Clique in the Divisibility Graph 分类: 比赛 2015-08-02 09:02 23人阅读 评论(3) 收藏
Clique in the Divisibility Graph time limit per test1 second memory limit per test256 megabytes inpu ...
- Unix网络编程--卷二:进程间通信
Unix网络编程--卷二:进程间通信 本书是一部Unix网络编程的经典之作!进程间通信(IPC)几乎是所有Unix程序性能的关键,理解IPC也是理解如何开发不同主机网络应用程序的必要条件.本书从对Po ...
- camera isp
1. 目标手机摄像头模组用ISP功能模块的市场走向及研发方向.为能够正确认识手机摄像模组行业提供技术及市场依据.2. ISP在模组上的应用原理2.1 功能区域无论数码相机.摄像机或者摄像手机,其影像数 ...
- python代码
f=open('/home/xbwang/newtextsimilarity/data/glove/glove.840B.300d.txt','r') count = 0 print ' '.join ...
- jquery简单插件到复杂插件(3)--顶部导航固定
那个效果很多,比如hao123的头部 <!DOCTYPE html> <html> <head> <meta charset="UTF-8" ...
- php获取 本月 本周 或者 下月 下周的 开始时间 结束时间
<?php $now_time = time(); $date=date("Y-m-d",$now_time); function get_date($date,$t='d' ...
- File.separator
摘自:http://blog.csdn.net/chindroid/article/details/7735832