一下代码只是一个参考，方法并单单这一种
- 纯CSS创建一个三角形
#demo{
width:0;
height:0;
border-width:20px;
border-style:solid;
border-color:transparent transparent red transparent
}
- 清除浮动
.clearfix:before, .clearfix:after {
content: " ";
display: table;
}
.clearfix:after {
clear: both;
}
.clearfix{
*zoom:1;
}
- 如何垂直居中一个浮动元素
// 方法一:已知元素的高度
#div1{
background-color:#6699FF;
width:200px;
height:200px;
/*父元素需要相对定位*/
position: absolute;
top: 50%;
left: 50%;
/*二分之一的 height，width*/
margin-top:-100px;
margin-left: -100px;
}
//方法二:未知元素的高宽 #div1
#div1{
width: 200px;
height: 200px;
background-color: #6699FF;
margin:auto;
position: absolute;
left: 0;
top: 0;
right: 0;
bottom: 0;
}
- IE5-8不支持opacity的解决方法
.opacity {
opacity: 0.4
filter: alpha(opacity=60); /* for IE5-7 */
-ms-filter:"progid:DXImageTransform.Microsoft.Alpha(Opacity=60)";
/* for IE 8*/
}
- position:fixed;在 android 下无效怎么处理 并不是 iOS 不支持 fixed，只是 fixed 的元素不是相对手机屏幕固定的
<meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, minimum-scale=1.0, user-scalable=no"/>
-
将字符串转化为数字
parseFloat('12.3b') -
浮点数点左边的数 没三位添加一个逗号 （12000000.11 -> 12,000,00.11）
function numStr (num) {
return num && num.toString().replace(/(\d)(?=(\d{3})+\.)/g, function($1, $2){
return $2 + ','
})
}
- 数组随机排序
// 方法一
function randSort1(arr) {
for (var i = 0, len = arr.length; i < len; i++) {
var rand = parseInt(Math.random() * len);
var temp = arr[rand];
arr[rand] = arr[i];
arr[i] = temp;
}
return arr
}
// 方法二 会修改原数组
function randSort2(arr) {
var mixedArray = [];
while(arr.length >0){
var randomIndex = parseInt(Math.random() * arr.length);
mixedArray.push(arr[randomIndex]);
arr.splice(randomIndex, 1);
}
return mixedArray
}
// 方法三 复用性低
var arr = [1,3,5,7,9,12,32,12]
arr.sort(function() {
return Math.random() - 0.5;
})
console.log(arr)
- 通用的监听器函数
markyun.Event = {
// 页面加载完成后
readyEvent: function (fn) {
if (fn == null) {
fn = document;
}
var oldonload = window.onload;
if (typeof window.onload != 'function') {
window.onload = fn;
} else {
window.onload = function () {
oldonload();
fn();
};
}
},
// 视能力分别使用 dom0||dom2||IE 方式 来绑定事件 // 参数: 操作的元素,事件名称 ,事件处理程序
addEvent: function (element, type, handler) {
if (element.addEventListener) {
//事件类型、需要执行的函数、是否捕捉
element.addEventListener(type, handler, false);
} else if (element.attachEvent) {
element.attachEvent('on' + type, function () {
handler.call(element);
});
} else {
element['on' + type] = handler;
}
},
// 移除事件
removeEvent: function (element, type, handler) {
if (element.removeEventListener) {
element.removeEventListener(type, handler, false);
} else if (element.datachEvent) {
element.detachEvent('on' + type, handler);
} else {
element['on' + type] = null;
}
},
// 阻止事件 (主要是事件冒泡，因为 IE 不支持事件捕获)
stopPropagation: function (ev) {
if (ev.stopPropagation) {
ev.stopPropagation();
} else {
ev.cancelBubble = true;
}
},
// 取消事件的默认行为
preventDefault: function (event) {
if (event.preventDefault) {
event.preventDefault();
} else {
event.returnValue = false;
}
},
// 获取事件目标
getTarget: function (event) {
return event.target || event.srcElement;
},
// 获取 event 对象的引用，取到事件的所有信息，确保随时能使用 event;
getEvent: function (e) {
var ev = e || window.event;
if (!ev) {
var c = this.getEvent.caller;
while (c) {
ev = c.arguments[0];
if (ev && Event == ev.constructor) {
break;
}
c = c.caller;
}
}
return ev;
}
};
- 何判断某变量是否为数组数据类型
if (typeof Array.isArray === "undefined") {
Array.isArray = function (arg) {
return Object.prototype.toString.call(arg) === "[object Array]"
};
}
- 已知有字符串 foo=”get-element-by-id”,写一个 function 将其转化成驼 峰表示法”getElementById”
function combo(msg) {
var arr = msg.split("-");
for (var i = 1; i < arr.length; i++) {
arr[i] = arr[i].charAt(0).toUpperCase() + arr[i].substr(1, arr[i].length - 1);
}
msg = arr.join("");
return msg;
}
- var numberArray = [3,6,2,4,1,5];(考察基础API)
- 实现对该数组的倒排，输出[5,1,4,2,6,3]
numberArray.reverse() - 实现对该数组的降序排列，输出[6,5,4,3,2,1]
numberArray.sort(function(a,b){return b-a})
