js

核心 ecma script:js的基礎語法 bom：對瀏覽器物件操作 dom:對網頁屬性操作
期望 實現動態效果和使用者互動功能

五種最基本型別：number string null boolean undefined(都是用var來接收，這也是js的弱語言性)

問題： 在根據typeof判斷型別或者if判空時，null與undefined有什麼區別嗎？
方案：當然，null是object型別，其實是佔著位元組符的，而undefined是根本沒有定義

問題： js判空，if(屬性)，當屬性為空時，才為true，與StringUtils的Isnotblank相反

函式方法：命名方法   匿名方法
    注意：js方法不可以過載，只可以覆蓋，還有就是方法引數不一定傳全，可以傳部分，按引數順序獲取值

命名方法：function add(val){}
呼叫：標籤內直接呼叫 <input onclik="add(val)"/> a標籤也行 <a href="javascript:;" onclick=""/>

匿名方法：document.getElementById().onclick=function(){} 在js內獲得標籤，在對應給方法

拓展
onblur 失焦事件 onfocus獲得焦點事件 onclick點選事件 ondbclick雙擊事件 onmouseover滑鼠懸浮事件
onmouseout滑鼠移開事件 onsubmit提交事件 onchange改變內容事件 onkeyup鍵盤松開事件 onload頁面載入

核心： 內建物件
js物件本質就是陣列物件，jq轉js時就是按照陣列轉的，其內建物件就是陣列，它與java的大不相同，陣列長度動態變化，資料型別可以不一樣，有大量方法
方法：concat連線陣列 reverse 陣列反轉 join將陣列拼成字串 sort對陣列排序，可以自定義sort(function(m,n)),m-n>0正序
注意：如果js根據類名或標籤名獲得資料，那這些資料就可以是一個數組

日期物件：new date().toLocalString() 不常用，可以瞭解下

全域性物件:顧名思義，在js範圍內都可以用
parseInt 將字串轉成數字，注意：如果含有非數字字串，已發現就停止轉換 parseFloat原理一樣
isNaN判斷數字型別，如果不是數字才為true
encodeUrl把字串進行url編碼 decodeUrl按url解碼，這還是有用的，一般用於網頁地址傳值時在擷取值出現亂碼問題

**核心

Bom

三天王：window history location
window：alert（提示） confirm(確定） setInterval(方法名，時間)設定迴圈事件  setTimeout(方法名，時間)設定延遲事件，只執行依次 clearInterval clearTimeout
//1000毫秒呼叫begin()
timer = window.setInterval(begin, 1000);

location: href=地址，不但可以獲取當前地址，還可以跳向指定地址 reload（）重新整理頁面

history：forword（）前進 back（）返回 go(-1)返回 go(1)前進 go(0)不動

Dom

ducument.getElementByid byName byTagName byClassName 其實都返回的是陣列，只不過id返回的是陣列第一個數而已

.innerHtml="“操作是往標籤內填資料，jq則是用的.html()，純文字就是.innerText,jq對應.txt(),獲得物件值用.value就行，賦值時也可以.value=”"就行，src同理

js操作css，一般是物件.style.屬性，和jq的物件.css(“屬性”,“值”)一樣，當然，也可以再獲得物件後直接.classname=""來操作

jq

頁面載入，$(function(){})一般對匿名函式要使用，因為要先獲取對應id，與$(ducment).ready(function)效果一樣
常用選擇器：
$("#id") $("標籤") $(".class") $(父標籤 子標籤）$("標籤[屬性='值']") $("div[id][title='test']").css("background‐color","red");
還有一些混合使用的基本選擇器：even ：odd  :eq(標籤按索引) $("div:eq(3)").css("background‐color","red");
還用狀態的 :checked :selected 		var $checkedInput = $("input[type='checkbox']:checked");

注意 checkbox對應checked select對應selected
還有就是js與jq之間的轉換, var js=jq[0] var jq=$(js) 記住this物件屬於js，用時要轉換

Dom

最常用的無非三個.val() .html() .text() 既可以取值，也可以傳值
獲取或更改屬性值 attr(“屬性”，”值“) prop（“屬性”，”值“）後面更強，因為還可以對check與select操作
KaTeX parse error: Expected 'EOF', got '#' at position 3: ("#̲bj").removeAttr…("#hobby").prop(“checked”));//boolean值
js可以通過getAttribute獲得值，jq好像只可以操作，不可以獲取

對css操作 .css(“樣式”,“內容”) .addClass(“外部樣式名”)與js的.classname類似，也可以移除$("#one").css(“background‐color”,“green”);
.remove可以移除指定物件 .empty可以清除子節點，不包含自己

動畫效果
顯示：.show（“時間”,“效果”）.hide() .toggle()切換 裡面的效果swing liner
滑動：.slidedown() .slideup() .slidetoggle 效果同上
淡出:fadeIn() fadeout fadeToggle

核心： 遍歷
傳統for(var i=0;i<;i++)

jq:
	物件.each(function(index,element){})
	$(物件,function(index,element){})
	var $lis = $("#city li");
	$.each($lis, function(index,element) {
	alert(index+"‐‐"+$(element).html());
	});
	新特性：for(element of 物件){}

事件繫結
物件.on(“觸發事件”，function(){})觸發事件有：click blur focus mouseover mouseout
$("#btn").on(“click”,function(){
alert(“使用on繫結點選事件”);
})
也可以不通過on，直接物件.click(function(){})也行，當然,.off("")可以取消on裡面的事件

注意 這裡也支援鏈式編寫

$("#myDiv").mouseover(function(){
	$(this).css("background","green");
	}).mouseout(function(){
	$(this).css("background","red");
	});
還有就是切換方法：物件.hover(funtion1,function2)

**校驗**
物件.validate({rules:{},messages:{}})
自定義校驗規則
$.validator.addMethod(function(value,element,param)){}param預設時true，如果為false,就不會走這步了

$.validator.addMethod("checkNum",function(value,element,param){
if(param){
//校驗15位的規則是否正確 ‐‐‐ 都是數字
var regExp18 = /^[0‐9]{18}|[0‐9]{17}X$/;
if(value.trim().length==18){
//校驗格式
return regExp18.test(value.trim());
}
} return true;//放行 不歸該校驗器校驗});

$("#empForm").validate({
rules:{
realname:"required",
username:{
required:true,
rangelength:[5,8]
}}

拓展

： $.fn.extend{方法名：function(){}}方法拓展，可以自己創方法，以便全域性使用

$.fn.extend({
           	 mydo:function () {
                this.css("backgroundColor","red")
            	},
           	 mydo2:function () {
                this.css("backgroundColor","yellow")
           	 }
        	})
        	function smydo() {
            $("#mydiv").mydo()
       	 }
        	function smydo2() {
            $("#mydiv").mydo2()
        	}