專案中使用到的前端知識點
1 設定跳轉
如果一個超連結,點選之後不做任何事情, <a href="javascript:void(0);">
<a href="javascript:void(0);">如果設定為 # ,如果有滾動條,會跳轉到頂部
2 json物件
JSON.parse(data);----從json字串轉換成json物件
$.parseJSON(data);----從json字串轉換成json物件
JSON.stringify();----把json物件轉換成json字串
Json的簡單介紹
從結構上看，所有的資料最終都可以分成三種類型：
第一種型別是scalar（標量），也就是一個單獨的string（字串）或數字（numbers），比如“北京”這個單獨的詞。
第二種型別是sequence（序列），也就是若干個相關的資料按照一定順序並列在一起，又叫做array（陣列）或List(列表)，比如“北京，東京”。
第三種類型是mapping（對映），也就是一個名/值對（Name/value），即資料有一個名稱，還有一個與之相對應的值，這又稱作hash（雜湊）或dictionary（字典），比如“首都：北京”。
JSON(JavaScript Object Notation) 是一種輕量級的資料交換格式，它的規則非常簡單並且是
1） 並列的資料之間用逗號（“，”）分隔。
2） 對映用冒號（“：”）表示。
3） 並列資料的集合（陣列）用方括號("[]")表示。
4） 對映的集合（物件）用大括號（“{}”）表示。
按照這個規則可以作以下理解：
1.陣列用“[]”建立，物件用“{}”建立，並且使用Json基本都是用[]或者{}建立的陣列或物件，否則一個普通的字串是沒有意義的；
2.無論是陣列還是物件，之間的元素都用“，”隔開；
3.物件內部，（屬性的）名稱和值用“：”隔開，並且必須要用“：”隔開，不可單獨存在屬性名或者值；
4.物件和陣列可以互相巢狀，即陣列中的一個元素可以是一個物件也可以是一個數組，同理物件中的一個屬性的值可以是一個物件也可以是一個數組。
3 jquery 字串擷取操作
var str="ssssss.aa"
str=str.substr(0, str.indexOf("."))
4 jquery tabs()
使得3個tab 點選可以替換內容
<!doctype html> <html> <head> <meta charset="utf-8"> <title>jQuery UI 標籤頁（Tabs） - 預設功能</title> <link rel="stylesheet" href="//apps.bdimg.com/libs/jqueryui/1.10.4/css/jquery-ui.min.css"> <script src="//apps.bdimg.com/libs/jquery/1.10.2/jquery.min.js"></script> <script src="//apps.bdimg.com/libs/jqueryui/1.10.4/jquery-ui.min.js"></script> <link rel="stylesheet" href="http://www.runoob.com/try/demo_source/jqueryui/style.css"> <script> $(function() { $( "#tabs" ).tabs(); }); </script> </head> <body> <div id="tabs"> <ul> <li><a href="#tabs-1">Nunc tincidunt</a></li> <li><a href="#tabs-2">Proin dolor</a></li> <li><a href="#tabs-3">Aenean lacinia</a></li> </ul> <div id="tabs-1"> 1 </div> <div id="tabs-2"> 2</div> <div id="tabs-3"> 3 </div> </div> </body> </html>
設定再次點選,摺疊tab
<html lang="en">
<head>
<meta charset="utf-8">
<title>jQuery UI 標籤頁（Tabs） - 摺疊內容</title>
<link rel="stylesheet" href="//code.jquery.com/ui/1.10.4/themes/smoothness/jquery-ui.css">
<script src="//code.jquery.com/jquery-1.9.1.js"></script>
<script src="//code.jquery.com/ui/1.10.4/jquery-ui.js"></script>
<link rel="stylesheet" href="http://jqueryui.com/resources/demos/style.css">
<script>
$(function() {
$( "#tabs" ).tabs({
//允許摺疊
collapsible: true
});
});
</script>
</head>
js中的四捨五入
NumberObject.toFixed(num)
例如
1/3 保留3位小數
(1/3).toFixed(3)避免出現undefined
var temp = conditionData.temp;
//null or undefined or NaN
if(!temp){
temp = weatherData.wendu ? weatherData.wendu : " " ;
}
日期格式化
function formatDate(time,format='YY-MM-DD hh:mm:ss'){
var date = new Date(time);
var year = date.getFullYear(),
month = date.getMonth()+1,//月份是從0開始的
day = date.getDate(),
hour = date.getHours(),
min = date.getMinutes(),
sec = date.getSeconds();
var preArr = Array.apply(null,Array(10)).map(function(elem, index) {
return '0'+index;
});////開個長度為10的陣列 格式為 00 01 02 03
var newTime = format.replace(/YY/g,year)
.replace(/MM/g,preArr[month]||month)
.replace(/DD/g,preArr[day]||day)
.replace(/hh/g,preArr[hour]||hour)
.replace(/mm/g,preArr[min]||min)
.replace(/ss/g,preArr[sec]||sec);
return newTime;
}
formatDate(new Date().getTime());//2017-05-12 10:05:44
formatDate(new Date().getTime(),'YY年MM月DD日');//2017年05月12日
formatDate(new Date().getTime(),'今天是YY/MM/DD hh:mm:ss');//今天是2017/05/12 10:07:45js獲取前一天
new Date().getTime()-3600*24*1000