1. 程式人生 > >亂七八槽的小積累-1(h5+css)

亂七八槽的小積累-1(h5+css)

判斷物件陣列中是否存在指定key值的物件

/**
   * 判斷物件陣列array中是否已存在key值為keyPara的物件
   * 存在返回true,不存在返回false
   */
  itemInArray = (keyPara , array) => {
    let flag = false
    const length = array.length
    console.log(length)
    if (length < 1) {
      flag = false
    } else if (length >= 1) {
      for
(const value of array) { if (value.key === keyPara) { flag = true break } else { flag = false } } } return flag }

向陣列首部新增元素

array.unshift(arrayItem)
// 對應的在後面追加就是我們常用的push
array.push(arrayItem)
// 還有一個翻轉陣列中元素順序的方法,需要注意的是arr.reverse()在原陣列上實現這一功能,即,reverse()會改變原陣列。
array.reverse()

刪除物件陣列中指定key值的物件

  /**
   * 刪除物件陣列中指定key值的物件
   */
  delectObjectFromObjectArrayByObjectKey = (key , objectArray) => {
    for (const value of objectArray!) {
      if (value.key === key) {
       const index = objectArray!.indexOf(value)
       objectArray!.splice(index, 1)
      break
} } }

div滾輪位置獲取和設定

這裡需要滾輪的div的id值為list

// 獲取
var y =  JSON.stringify(document.getElementById('list').scrollTop)
// 設定
document.getElementById('list').scrollTop = y

div滾輪樣式自定義

這裡需要滾輪的div的id值為list,想要使用滾輪對應div高度要給定

/*div樣式*/
.list {
  padding: 5px 10px;
  height: 415px; /*面板高度*/
  overflow-y: auto; // y軸方向自動出現滾輪
}
/*滾動條樣式*/
.list::-webkit-scrollbar {/*滾動條整體樣式*/
   width: 4px;     /*高寬分別對應橫豎滾動條的尺寸*/
   height: 4px;
}
.list::-webkit-scrollbar-thumb {/*滾動條裡面小方塊*/
  border-radius: 5px;
  -webkit-box-shadow: inset 0 0 5px rgba(0,0,0,0.2);
  background: rgba(0,0,0,0.2);
}
.list::-webkit-scrollbar-track {/*滾動條裡面軌道*/
  -webkit-box-shadow: inset 0 0 5px rgba(0,0,0,0.2);
  border-radius: 5px;
  background: rgba(0,0,0,0.1);
}

效果圖:
在這裡插入圖片描述

setTimeout和setInterval

setTimeout只在指定時間後執行一次,setInterval以指定時間為週期迴圈執行。

// setTimeout
function hello(){
	alert("hello");
}
// 使用方法名字執行方法
var t1 = window.setTimeout(hello,1000);
var t2 = window.setTimeout("hello()",3000);//使用字串執行方法
window.clearTimeout(t1);//去掉定時器

//========================================================

// setInterval
//實時重新整理時間單位為毫秒
interval1=setInterval('refreshQuery()',8000); 
/* 重新整理查詢 */
function refreshQuery(){
$("#mainTable").datagrid('reload',null);
}
// 清除定時器
window.clearInterval(interval1)

localStroage操作

 // 存
 localStorage.setItem('data',JSON.stringify(array));
 // 取
array = JSON.parse(localStorage.getItem('data));
// 刪
localStorage.removeItem('data')

更多 參考

javascript