[js插件开发教程]一步步开发一个可以定制配置的隔行变色小插件
隔行变色功能，不用js，直接用css伪类就可以做，这个实例可以作为js插件开发很好的入门级实例。本文实现的隔行变色包括以下功能：
1，支持2种常用结构共存( div元素 和 表格类型 )
2，一个页面内支持不同模块隔行变色，分别管理
3，可以定制的配置有：
奇/偶数行的背景颜色
特定的模块加上隔行变色
当前激活行的颜色
隔行变色的元素类型定制
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<meta http-equiv="X-UA-Compatible" content="ie=edge">
<title>隔行变色插件开发 - by ghostwu</title>
<style>
table {
border-collapse: collapse;
width: 100%;
}
th,
td {
padding: 10px 30px;
border: 1px solid #ccc;
}
.even-color {
background: #ccc;
}
.odd-color {
background: #eee;
}
.even-color2 {
background: #000;
}
.odd-color2 {
background: #666;
}
.current {
background: yellow;
}
.active {
background: #09f;
}
#box div,
#box2 div {
margin: 10px;
padding: 10px;
border: 1px solid #ccc;
}
</style>
</style>
<script>
(function () {
/*
隔行变色
选项卡
全选不选反选
*/
var ghostwu = {};
/***************隔行变色开始***************/
ghostwu.BgColor = {
Bg: function (option) {
return new ghostwu.BgColor.init(option);
}
};
ghostwu.BgColor.init = function (option) {
this.oldColor = null;
this.opt = {
'activeClass': 'active',
'evenClass': 'even-color',
'oddClass': 'odd-color',
'ele': 'div',
'context': document
}; //存储默认配置
for (var key in option) {
this.opt[key] = option[key];
}
if (this.opt.ele == 'div') {
var curCxt = this.opt.context;
if (typeof this.opt['context'] === 'string') {
curCxt = document.querySelector(this.opt['context']);
}
this.elements = curCxt.querySelectorAll(this.opt.ele);
} else {
this.elements = this.opt.context.querySelectorAll(this.opt.ele + ' tr');
for (var i = 0; i < this.elements.length; i++) {
if (this.elements[i].children[0].nodeName.toLowerCase() == 'th') {
this.elements = [].slice.call(this.elements);
this.elements.splice(i, 1);
}
}
}
}
ghostwu.BgColor.init.prototype.setBgColor = function () {
for (var i = 0; i < this.elements.length; i++) {
if (i % 2 == 0) {
this.elements[i].className = this.opt['evenClass'];
} else {
this.elements[i].className = this.opt['oddClass'];
}
}
}
ghostwu.BgColor.init.prototype.hover = function () {
var that = this;
for (var i = 0; i < this.elements.length; i++) {
this.elements[i].onmouseover = function () {
that.addBg(this);
};
this.elements[i].onmouseout = function () {
that.removeBg(this);
}
}
}
ghostwu.BgColor.init.prototype.addBg = function (curObj) {
this.oldColor = curObj.className;
curObj.className = this.opt['activeClass'];
}
ghostwu.BgColor.init.prototype.removeBg = function (curObj) {
curObj.className = this.oldColor;
}
/***************隔行变色结束***************/
window.g = ghostwu;
})();
</script>
<script>
window.onload = function () {
var oBg = g.BgColor.Bg({
'activeClass': 'current',
'ele': 'table'
});
oBg.setBgColor();
oBg.hover();
var oBg2 = g.BgColor.Bg({
'activeClass': 'active',
'ele': 'div',
'context': '#box'
});
oBg2.setBgColor();
oBg2.hover();
var oBg3 = g.BgColor.Bg({
'activeClass': 'current',
'ele': 'div',
'evenClass': 'even-color2',
'oddClass': 'odd-color2',
'context': '#box2'
});
oBg3.setBgColor();
oBg3.hover();
}
</script>
</head>
<body>
<div id="box">
<div></div>
<div></div>
<div></div>
<div></div>
</div>
<div id="box2">
<div></div>
<div></div>
<div></div>
<div></div>
<div></div>
<div></div>
</div>
<table>
<tr>
<th>姓名</th>
<th>性别</th>
<th>年龄</th>
</tr>
<tr>
<td>张三</td>
<td>man</td>
<td>20</td>
</tr>
<tr>
<td>张三</td>
<td>man</td>
<td>20</td>
</tr>
<tr>
<td>张三</td>
<td>man</td>
<td>20</td>
</tr>
<tr>
<td>张三</td>
<td>man</td>
<td>20</td>
</tr>
<tr>
<td>张三</td>
<td>man</td>
<td>20</td>
</tr>
<tr>
<td>张三</td>
<td>man</td>
<td>20</td>
</tr>
<tr>
<td>张三</td>
<td>man</td>
<td>20</td>
</tr>
</table>
</body>
</html>
run code
(function(){
/*
隔行变色
选项卡
全选不选反选
*/
var ghostwu = {};
/***************隔行变色开始***************/
ghostwu.BgColor = {
};
ghostwu.BgColor.init = function(){
}
ghostwu.BgColor.setBgColor = function(){
}
ghostwu.BgColor.hover = function(){
}
ghostwu.BgColor.addBg = function(){
}
ghostwu.BgColor.removeBg = function(){
}
/***************隔行变色结束***************/
/***************选项卡开始***************/
ghostwu.Tab = {
};
ghostwu.Tab.init = function(){
}
ghostwu.Tab.bindEvent = function(){
}
ghostwu.BgColor.switchTab = function(){
}
/***************选项卡结束***************/
window.g = ghostwu;
})();
一、首先定义一个一级的命名空间 ghostwu = {}，然后通过window对象 暴露这个对象 给外部使用
接下来开发的插件，只要加在我的一级命名空间中即可，如：
ghostwu.BgColor
ghostwu.Tab
ghostwu.Page
ghostwu.Module
........等等
插件的具体方法，在二级命名空间继续增加，如：
ghostwu.BgColor.init
为隔行变色插件( BgColor ) 添加一个初始化方法( init )
二、实现一个不能定制配置的隔行变色功能
demo.js代码
var ghostwu = {};
/***************隔行变色开始***************/
ghostwu.BgColor = {
oldColor : null
};
ghostwu.BgColor.init = function(){
this.aDiv = document.querySelectorAll( "div" );
}
ghostwu.BgColor.setBgColor = function(){
for( var i = 0; i < this.aDiv.length; i++ ){
if ( i % 2 == 0 ){
this.aDiv[i].className = 'even-color';
}else {
this.aDiv[i].className = 'odd-color';
}
}
}
ghostwu.BgColor.hover = function(){
var that = this;
for( var i = 0 ; i < this.aDiv.length; i++ ){
this.aDiv[i].onmouseover = function(){
that.addBg( this );
}
this.aDiv[i].onmouseout = function(){
that.removeBg( this );
}
}
}
ghostwu.BgColor.addBg = function( curObj ){
this.oldColor = curObj.className;
curObj.className = 'active';
}
ghostwu.BgColor.removeBg = function( curObj ){
curObj.className = this.oldColor;
}
/***************隔行变色结束***************/
html页面布局代码
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<meta http-equiv="X-UA-Compatible" content="ie=edge">
<title>隔行变色 - by ghostwu</title>
<style>
div{
margin:10px;
padding:20px;
border:1px solid #ccc;
}
.even-color {
background:#ccc;
}
.odd-color {
background: #eee;
}
.active {
background:yellow;
}
</style>
<script src="./lib/demo.js"></script>
<script>
window.onload = function(){
var oBg = g.BgColor;
oBg.init();
oBg.setBgColor();
oBg.hover();
}
</script>
</head>
<body>
<div></div>
<div></div>
<div></div>
<div></div>
<div></div>
<div></div>
</body>
</html>
至此，一个简单的隔行变色功能就完成了，但是不能称之为插件，因为这个功能现在是写死的
var ghostwu = {};
/***************隔行变色开始***************/
ghostwu.BgColor = {
oldColor : null,
opt : {
'activeClass' : 'active',
'oddClass' : 'odd-color',
'evenClass' : 'even-color',
'ele' : 'div'
}
};
ghostwu.BgColor.init = function(){
this.elements = document.querySelectorAll( this.opt['ele'] );
}
ghostwu.BgColor.setBgColor = function(){
for( var i = 0; i < this.elements.length; i++ ){
if ( i % 2 == 0 ){
this.elements[i].className = this.opt['evenClass'];
}else {
this.elements[i].className = this.opt['oddClass'];
}
}
}
ghostwu.BgColor.hover = function(){
var that = this;
for( var i = 0 ; i < this.elements.length; i++ ){
this.elements[i].onmouseover = function(){
that.addBg( this );
}
this.elements[i].onmouseout = function(){
that.removeBg( this );
}
}
}
ghostwu.BgColor.addBg = function( curObj ){
this.oldColor = curObj.className;
curObj.className = this.opt['activeClass'];
}
ghostwu.BgColor.removeBg = function( curObj ){
curObj.className = this.oldColor;
}
/***************隔行变色结束***************/
经过修改之后，我们就可以通过 opt这个json 配置样式和元素结构了， 接下来，我们就得增加参数配置了
四、参数配置
只需要在demo.js代码中，加入一个for循环，把参数的配置复制给opt即可
ghostwu.BgColor.init = function( option ){
for( var key in option ){
this.opt[key] = option[key];
}
this.elements = document.querySelectorAll( this.opt['ele'] );
}
html测试页面修改如下：
<style>
div{
margin:10px;
padding:20px;
border:1px solid #ccc;
}
.even-color2 {
background:#000;
}
.odd-color2 {
background: #666;
}
.current {
background:#08f;
}
</style>
<script src="./lib/demo.js"></script>
<script>
window.onload = function(){
var oBg = g.BgColor;
oBg.init({
'activeClass' : 'current',
'evenClass' : 'even-color2',
'oddClass' : 'odd-color2'
});
oBg.setBgColor();
oBg.hover();
}
</script>
五、完善元素的配置
在第四步中，class都可以定制了，但是ele还不能定制，这个ele就是控制隔行变色的结构
修改init函数如下：
ghostwu.BgColor.init = function( option ){
for( var key in option ){
this.opt[key] = option[key];
}
if ( this.opt['ele'] == 'div' ) {
this.elements = document.querySelectorAll( this.opt['ele'] );
}else{
this.elements = document.querySelectorAll( this.opt['ele'] + " tr" );
this.elements = [].slice.call( this.elements );
for( var i = 0 ; i < this.elements.length; i++ ){
if ( this.elements[i].children[0].nodeName.toLowerCase() == 'th' ) {
this.elements.splice( i, 1 );
}
}
}
}
测试页面的代码修改如下：
<!DOCTYPE html>
<html lang="en"> <head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<meta http-equiv="X-UA-Compatible" content="ie=edge">
<title>隔行变色 - by ghostwu</title>
<style>
table {
border-collapse: collapse;
width: 100%;
} th,
td {
padding: 10px 30px;
border: 1px solid #ccc;
}
div {
margin: 10px;
padding: 20px;
border: 1px solid #ccc;
} .even-color2 {
background: #000;
} .odd-color2 {
background: #666;
} .current {
background: #08f;
}
</style>
<script src="./lib/demo.js"></script>
<script>
window.onload = function () {
var oBg = g.BgColor;
oBg.init({
'activeClass': 'current',
'evenClass': 'even-color2',
'oddClass': 'odd-color2'
});
oBg.setBgColor();
oBg.hover(); var oBg2 = g.BgColor;
oBg2.init({
'activeClass': 'current',
'evenClass': 'even-color2',
'oddClass': 'odd-color2',
'ele' : 'table'
});
oBg2.setBgColor();
oBg2.hover();
} </script>
</head> <body>
<div></div>
<div></div>
<div></div>
<div></div>
<div></div>
<div></div>
<table>
<tr>
<th>姓名</th>
<th>性别</th>
<th>年龄</th>
</tr>
<tr>
<td>ghostwu</td>
<td>man</td>
<td>20</td>
</tr>
<tr>
<td>ghostwu</td>
<td>man</td>
<td>20</td>
</tr>
<tr>
<td>ghostwu</td>
<td>man</td>
<td>20</td>
</tr>
<tr>
<td>ghostwu</td>
<td>man</td>
<td>20</td>
</tr>
<tr>
<td>ghostwu</td>
<td>man</td>
<td>20</td>
</tr>
<tr>
<td>ghostwu</td>
<td>man</td>
<td>20</td>
</tr>
<tr>
<td>ghostwu</td>
<td>man</td>
<td>20</td>
</tr>
</table>
</body> </html>
至此，我们开发的功能，勉强算个插件了，但是，不能按区域控制，比如页面上有10个div, 分成2部分，一部分有5个div，另外一部分也是5个，我想其中一部分div加上隔行变色效果。另外一部分不加.
六、分块控制
ghostwu.BgColor = {
oldColor : null,
opt : {
'activeClass' : 'active',
'oddClass' : 'odd-color',
'evenClass' : 'even-color',
'ele' : 'div',
'context' : document
}
};
ghostwu.BgColor.init = function( option ){
for( var key in option ){
this.opt[key] = option[key];
}
var cxt = this.opt['context'];
if ( typeof cxt === 'string' ){
cxt = document.querySelector( this.opt['context'] );
}
if ( this.opt['ele'] == 'div' ) {
this.elements = cxt.querySelectorAll( this.opt['ele'] );
}else{
this.elements = cxt.querySelectorAll( this.opt['ele'] + " tr" );
this.elements = [].slice.call( this.elements );
for( var i = 0 ; i < this.elements.length; i++ ){
if ( this.elements[i].children[0].nodeName.toLowerCase() == 'th' ) {
this.elements.splice( i, 1 );
}
}
}
}
修改html页面代码如下：
<!DOCTYPE html>
<html lang="en"> <head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<meta http-equiv="X-UA-Compatible" content="ie=edge">
<title>隔行变色 - by ghostwu</title>
<style>
table {
border-collapse: collapse;
width: 100%;
} th,
td {
padding: 10px 30px;
border: 1px solid #ccc;
} .even-color {
background: #ccc;
} .odd-color {
background: #eee;
} .even-color2 {
background: #000;
} .odd-color2 {
background: #666;
} .current {
background: yellow;
} .active {
background: #09f;
} #box div,
#box2 div {
margin: 10px;
padding: 10px;
border: 1px solid #ccc;
}
</style>
<script src="./lib/demo.js"></script>
<script>
window.onload = function () {
var oBg = g.BgColor;
oBg.init({
'activeClass': 'current',
'evenClass': 'even-color2',
'oddClass': 'odd-color2',
'context' : '#box'
});
oBg.setBgColor();
oBg.hover(); var oBg3 = g.BgColor;
oBg3.init({
'activeClass': 'active',
'evenClass': 'even-color',
'oddClass': 'odd-color',
'context' : '#box2'
});
oBg3.setBgColor();
oBg3.hover(); var oBg2 = g.BgColor;
oBg2.init({
'activeClass': 'current',
'evenClass': 'even-color2',
'oddClass': 'odd-color2',
'ele': 'table',
'context' : document
});
oBg2.setBgColor();
oBg2.hover();
}
</script>
</head> <body>
<div id="box">
<div></div>
<div></div>
<div></div>
<div></div>
</div>
<div id="box2">
<div></div>
<div></div>
<div></div>
<div></div>
<div></div>
<div></div>
</div>
<table>
<tr>
<th>姓名</th>
<th>性别</th>
<th>年龄</th>
</tr>
<tr>
<td>ghostwu</td>
<td>man</td>
<td>20</td>
</tr>
<tr>
<td>ghostwu</td>
<td>man</td>
<td>20</td>
</tr>
<tr>
<td>ghostwu</td>
<td>man</td>
<td>20</td>
</tr>
<tr>
<td>ghostwu</td>
<td>man</td>
<td>20</td>
</tr>
<tr>
<td>ghostwu</td>
<td>man</td>
<td>20</td>
</tr>
<tr>
<td>ghostwu</td>
<td>man</td>
<td>20</td>
</tr>
<tr>
<td>ghostwu</td>
<td>man</td>
<td>20</td>
</tr>
</table>
</body> </html>
这样我们就可以达到分块控制的目的，但是，如果你仔细一点，应该能发现一个问题，activeClass设置的样式产生了覆盖，3个区域不能定制activeClass。这个就是单例模式无法解决的问题，我们可以通过构造函数解决
七、构造函数解决属性配置覆盖的问题
(function(){
/*
隔行变色
选项卡
全选不选反选
*/
var ghostwu = {};
/***************隔行变色开始***************/
ghostwu.BgColor = {
Bg : function( option ){
return new ghostwu.BgColor.init( option );
}
};
ghostwu.BgColor.init = function( option ){
this.oldColor = null;
this.opt = {
'activeClass' : 'active',
'evenClass' : 'even-color',
'oddClass' : 'odd-color',
'ele' : 'div',
'context' : document
}; //存储默认配置
for( var key in option ){
this.opt[key] = option[key];
}
if ( this.opt.ele == 'div' ){
var curCxt = this.opt.context;
if ( typeof this.opt['context'] === 'string' ) {
curCxt = document.querySelector( this.opt['context'] );
}
this.elements = curCxt.querySelectorAll( this.opt.ele );
}else {
this.elements = this.opt.context.querySelectorAll( this.opt.ele + ' tr' );
for( var i = 0; i < this.elements.length; i++ ){
if( this.elements[i].children[0].nodeName.toLowerCase() == 'th'){
this.elements = [].slice.call( this.elements );
this.elements.splice( i, 1 );
}
}
}
}
ghostwu.BgColor.init.prototype.setBgColor = function(){
for( var i = 0 ; i < this.elements.length; i++ ){
if ( i % 2 == 0 ) {
this.elements[i].className = this.opt['evenClass'];
}else {
this.elements[i].className = this.opt['oddClass'];
}
}
}
ghostwu.BgColor.init.prototype.hover = function(){
var that = this;
for( var i = 0 ; i < this.elements.length; i++ ){
this.elements[i].onmouseover = function(){
that.addBg( this );
};
this.elements[i].onmouseout = function(){
that.removeBg( this );
}
}
}
ghostwu.BgColor.init.prototype.addBg = function( curObj ){
this.oldColor = curObj.className;
curObj.className = this.opt['activeClass'];
}
ghostwu.BgColor.init.prototype.removeBg = function( curObj ){
curObj.className = this.oldColor;
}
/***************隔行变色结束***************/
window.g = ghostwu;
})();
页面测试代码：
<!DOCTYPE html>
<html lang="en"> <head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<meta http-equiv="X-UA-Compatible" content="ie=edge">
<title>隔行变色插件开发 - by ghostwu</title>
<style>
table {
border-collapse: collapse;
width: 100%;
} th,
td {
padding: 10px 30px;
border: 1px solid #ccc;
} .even-color {
background: #ccc;
} .odd-color {
background: #eee;
} .even-color2 {
background: #000;
} .odd-color2 {
background: #666;
} .current {
background: yellow;
} .active {
background: #09f;
} #box div,
#box2 div {
margin: 10px;
padding: 10px;
border: 1px solid #ccc;
}
</style>
<script src="./lib/common2.js"></script>
<script>
window.onload = function () {
var oBg = g.BgColor.Bg({
'activeClass': 'current',
'ele': 'table'
});
oBg.setBgColor();
oBg.hover(); var oBg2 = g.BgColor.Bg({
'activeClass': 'active',
'ele': 'div',
'context': '#box'
});
oBg2.setBgColor();
oBg2.hover(); var oBg3 = g.BgColor.Bg({
'activeClass': 'current',
'ele': 'div',
'evenClass': 'even-color2',
'oddClass': 'odd-color2',
'context': '#box2'
});
oBg3.setBgColor();
oBg3.hover();
}
</script>
</head> <body>
<div id="box">
<div></div>
<div></div>
<div></div>
<div></div>
</div>
<div id="box2">
<div></div>
<div></div>
<div></div>
<div></div>
<div></div>
<div></div>
</div>
<table>
<tr>
<th>姓名</th>
<th>性别</th>
<th>年龄</th>
</tr>
<tr>
<td>张三</td>
<td>man</td>
<td>20</td>
</tr>
<tr>
<td>张三</td>
<td>man</td>
<td>20</td>
</tr>
<tr>
<td>张三</td>
<td>man</td>
<td>20</td>
</tr>
<tr>
<td>张三</td>
<td>man</td>
<td>20</td>
</tr>
<tr>
<td>张三</td>
<td>man</td>
<td>20</td>
</tr>
<tr>
<td>张三</td>
<td>man</td>
<td>20</td>
</tr>
<tr>
<td>张三</td>
<td>man</td>
<td>20</td>
</tr>
</table>
</body> </html>
[js插件开发教程]一步步开发一个可以定制配置的隔行变色小插件的更多相关文章
- [js插件开发教程]实现一个比较完整的开源级选项卡插件
在这篇文章中,我实现了一个基本的选项卡功能:请猛击后面的链接>> [js插件开发教程]原生js仿jquery架构扩展开发选项卡插件. 还缺少两个常用的切换(自动切换与透明度渐变),当然 ...
- 动手开发一个名为“微天气”的微信小程序（上）
引言:在智能手机软件的装机量中,天气预报类的APP排在比較靠前的位置.说明用户对天气的关注度非常高.由于人们不管是工作还是度假旅游等各种活动都须要依据自然天气来安排.跟着本文开发一个"微天气 ...
- [js插件开发教程]原生js仿jquery架构扩展开发选项卡插件
jquery插件一般是这么干的: $.fn.插件名称 = function(){}, 把插件的名称加在.fn上,在源码里面实际上是扩展到构造函数的原型对象上,如果你没看过jquery的源代码,或者你曾 ...
- [js插件开发教程]定制一个手风琴插件(accordion)
本文带来一个垂直方向的手风琴插件开发,可以定制的功能如下: contentClass : 'panel', //面板样式navClass : 'nav', //导航样式activeClass : 'a ...
- ASP.NET Aries 入门开发教程3：开发一个列表页面及操控查询区
前言: Aries框架毕竟是开发框架,所以重点还是要写代码的,这样开发人员才不会失业,哈. 步骤1:新建html 建一个Html,主要有三步: 1:引入Aries.Loader.js 2:弄一个tab ...
- 【JS新手教程】replace替换一个字符串中所有的某单词
JS中的replace方法可以替换一个字符串中的单词.语句的格式是: 需要改的字符串.replace(字符串或正则表达式,替换成的字符串) 如果第一个参数用字符串,默认是找到该字符串中的第一个匹配的字 ...
- 开发一个根据xml创建代理类的小框架
github地址 https://github.com/1367356/GradleTestUseSubModule/tree/master/CreateMyFrameWork 1:定义一些规则
- 学习写了一个点击按钮倒计时的jquery小插件
(function($) { $.fn.extend({ getSms: function(value) { value = $.extend({ wait: 60, //参数, 默认60秒 }, v ...
- bootstrap开发一个简单网页。
CSS代码: body{ padding-top: 50px; padding-bottom: 50px; overflow: auto!important; ...
随机推荐
- 解决MVC模式文件下载附件中文名称乱码
解决如下: 进行url编码:Server.UrlPathEncode(file.AttachmentName) return File(file.TempWorkPath, CommonTools.G ...
- Project 9:两种简单数列排序
1.冒泡法排序 /* 冒泡排序法的核心思想就是依次把最大的数换到最后面. 若有n个数 就需要通过n-1次循环来排序. 具体做法就是从第一个数开始 两个数比较大小大的换到后面,这样最大的就在最后了. 然 ...
- 团队作业7——Alpha冲刺之事后诸葛亮（宣告项目失败团队解散）
一.项目进度 1.4月5日,团队组建.满怀希望的能做好这个项目 2.4月12日,需求分析. 3.4月21日,需求改进,出现协作问题,没有做好. 4.做项目,学习新的知识,继续做项目,但是能力有限,团队 ...
- 201521123063 《Java程序设计》 第8周学习总结
1. 本周学习总结 1.1 以你喜欢的方式(思维导图或其他)归纳总结集合与泛型相关内容. 这次就不弄思维导图了,就直接总结了 遍历Map的方法 (1)使用键值对for循环 Map<String, ...
- 201521123094 吴慧婷 Java课程设计
1. 团队课程设计博客链接 团队课程设计博客 2. 个人负责模块或任务说明 我的任务: (1)设置象棋的主窗口(仅将Board显示出来) (2)处理象棋的规则 (3)象棋界面的操作 (4)综合全部功能 ...
- Activiti-01
1, Activiti官网:http://www.activiti.org/ 主页可以看到jar包的下载. 2, 进入http://www.activiti.org/userguide/index. ...
- Configuration Extensions - 简化配置，让你配置支持变量
在开发"RabbitCloud"项目时,使用配置文件发现会有很多重复值,所以我基于"Microsoft.Extensions.Configuration"写了一 ...
- [python学习笔记] 数据类型与语法
数据类型 数值型 int 整形 没有long类型,可以代表任意大小的整数. type(1) -> int float 浮点数 也没有double类型 type(1.2) -> float ...
- linux kill 命令
kill 命令的用途 kill 命令很容易让人产生误解,以为它仅仅就是用来杀死进程的.我们来看一下 man page 对它的解释:kill - send a signal to a process. ...
- oracle数据库备份、还原 （如何将Oracle 11g备份的dat文件导入到10g数据库里面）
如何将Oracle 11g备份的dat文件导入到10g数据库里面 解决方法: 导出的时候后面加上目标数据库的版本号 导出: 在SQL plus下执行:create or replace ...