//eq(第几个) 从0开始
$("button").eq(0).click(function (){
    alert("增加");
});

var cf=$("#bk").outerHeight(true);

if(navigator.onLine){
  alert(1);
}else{
  alert(0);
}

$("标签").attr("属性","值")
列：按钮禁用
$("#login").attr("disabled",true)
//改变图片路径
$("#tp").attr("src","1.webp")
//获取属性值
var val=$("a").attr("price");

function fn2(){
		var c=["中国","米国","德国","法国"];//定义数组
		//遍历数组
		for(var i=0;i<c.length;i++){
			//访问数组里面的元素
			alert(c[i])
		}
	}

function fn2(){
		var c=["中国","米国","德国","法国"];//定义数组
		//遍历数组
		for(var i=0;i<c.length;i++){
			//访问数组里面的元素
			alert(c[i])
		}
		var ch=[4,7,8,9,7];
		//遍历数组2
		ch.forEach(fn3);//指向一个函数
	}
	function fn3(value){
		alert(value)
	}

document.getElementById("ID")

function fn1(){
	var obj=document.getElementById("p1");
	obj.innerText="西门庆"
	
	/* document.getElementById("p1").innerText="武大郎"; */
}
function fn2(){
	var bt=document.getElementById("btn1");//通过id的到元素
	var valu=bt.value;//获取元素的value属性
	if(valu=="开门"){
		bt.value="关门"; //改变元素的value这个属性
	}else{
		/* bt.value="开门"; */
		bt.setAttribute("value","开门");
	}
}

$("#testsbmit").click();

一、eval函数
	eval('字符串');
	字符串编程JS代码
一、获取html元素
	1、根据ID获取元素（单个元素）
		标签必须有id值
		document.getElementById("id值");
	2、根据name获取元素：(获取多个元素)
		var arr=document.getElementsByName("name值");
			取出某个元素
				arr[0] 第一个元素

	3、根据标签获取元素
		document.getElementsByTagName("标签");
		获取所有p标签
		document.getElementsByTagName("p");

	4、根据class属性
		document.getElementsByClassName("class值")

二、操作html常用属性和函数
	函数语法：html对象.函数名();
	属性语法：html对象.属性名;

	var a=document.getElementById("d1");
	1、获取设置某值：表单元素有属性value
		a.value
		获取选中单选按钮值
			a.checked 判断是否等于true

	2、获取某个属性
		a.getAttribute("属性名");
		根据不同id显示不同样式
	3、设置某个属性
		a.setAttribute("属性名","值");
		变色字体设置
	4、设置样式
		a.style.样式属性名="样式值"
			a.style.color="red";
			设置单个样式
		a.setAttribute("style","color:red;padding:5px;");
	5、移除属性
		a.removeAttribute("属性名");
	6、设置CSS样式名
		a.className="class值";
		class样式切换
			注：必须先准备类样式

	7、设置获取文字
		a.innerText="值"
	8、设置获取html代码
		a.innerHTML="html代码"
		设置多个div间隔添加html

	9、显示隐藏
		style中样式
			display:block  显示
			display:none  隐藏
		表单验证提示
		事件：
			onmouseover:鼠标移入事件
			onmouseout:鼠标移出事件
			onfocus:获得光标
			onblur：失去光标

function fn4(){
	var c=document.getElementsByTagName("li");//使用标签名查找
	//循环
	/* alert(c);
	c.forEach(fg); */
	//改变字体样式 
	for(var i=0;i<c.length;i++){
		//循环遍历 
		var oj=c[i];
		oj.className="myli";//修改元素 的className属性
	}
}

width() 方法设置或返回元素的宽度（不包括内边距、边框或外边距）。
height() 方法设置或返回元素的高度（不包括内边距、边框或外边距）。
var wid= $("body").width();//不包括内边距、边框或外边距
var heg=$("body").height();

innerWidth() 方法返回元素的宽度（包括内边距）。
innerHeight() 方法返回元素的高度（包括内边距）。
var inw=$("#d1").innerHeight();//包括内边距
var inh=$("#d1").innerWidth();

outerWidth() 方法返回元素的宽度（包括内边距和边框）。
outerWidth() 方法返回元素的宽度（包括内边距和边框）。
var ot=$("#d1").outerHeight();//包括内边距和边框
var otr=$("#d1").outerWidth();

outerWidth(true) 方法返回元素的宽度（包括内边距和边框 外边距）。
outerWidth(true) 方法返回元素的宽度（包括内边距和边框 外边距）。
var ottr=$("#d1").outerHeight(true); //包括内边距 边框 外边距
var otth=$("#d1").outerWidth(true);

var w=screen.width;  获取屏幕宽度
var h=screen.height;  获取屏幕高度

location.href="跳转页面";   跳转到指定的网页

location.href="servlet类名";
location.href="OrderServlet";  

else{request.setAttribute("errpr","账号或密码错误！")}，request.getRequestDispatcher("原来页面").forward(request, response);

history.back()后退
history.forward()前进

window.open('index3.jsp', 'index','top=100,left=100,width=500,height=200,scrollbars=no,toolbar=no,location=no');

onload="cf()"  cf()为js   //加载完后打开小窗口页面  function cf(){window.open('index3.jsp', 'index','top=100,left=100,width=500,height=200,scrollbars=no,toolbar=no,location=no');}

导入外部文件  必须把JQuery引入的放到第一
<script src="js/jquery-1.10.2.js"></script>

$(document).ready(function(){
	alert("我是JQuery 欢迎使用！")
});
//第二种写法 
$(function(){
	var div2=document.getElementById("d1");
	div2.innerHTML="<h1>good morning</h1>";
})

$("#ID名称")   接收时需要加$
列：
function fn1(){
	//ID选择器
	var $t=$("#d1");
	$t.html("<h1>中国</h1>");
	//第二种写法
	$("#d1").html("<h1>中国</h1>"); html=innerHTML
}

$("标签名") 获取标签为li的

$(this)  代表本身

设置CSS样式 
$("标签名").css("样式名","参数") 
mouseover鼠标移入的时候 
mouseout鼠标移出

mouseover(function(){
      
	  需要执行的事件
    
})

$("li").css("color", "pink").css("font-size","30px").css("background-color","black").mouseover(function(){
		$(this).css("background-color","red")
	}).mouseout(function(){
		$(this).css("background-color","blue")
	});

$(".class")

$(".类名")  获取类名为 .calss

//类选择器 input没有设onclick 事件  .click是鼠标点击事件
$(function(){
      //指定id对象的单击事件
	$("#btn1").click(function(){
	  //类选择器
		$(".mp").css("color","pink")
	})
})

当加载完这页面执行
$(function(){
	
})
//jquery 放文本 text("值")
$("#d1").text(data);

$("ul:first li:even") even:偶数

$("ul:first li:odd")  odd:奇数    //li偶数

$("ul:first") ul标签的第一个  first第一个

$("li").eq(2).css("font-size","40px");//定位到第几个

$("ul:first li") 第一个ul下的li标签  

$("ul:last li") //最后一个li  last最后一个

$("ul:first li").css({"font-size":"40px","background-color":"pink"})  样式数组写法

$(".c1").val();    //获取文本框的值 .val
$(".c1").val("值")  //给文本框设置值

/ on /单击事件 第一个执行事件的名称 /*click mouseover  mouseout... */  第二是具体的代码 function(){代码}
$(".d1").on("click",function(){

})

/  bind  /单击事件 第一个执行事件的名称 /*click mouseover  mouseout... */  第二是具体的代码 function(){代码}
$(".d1").bind("click",function(){
		
	})

$(".d1").bind("事件名称1" : function(){},"事件名称2":function(){},......)

<tr><td>桌子</td><td>3000</td><td><a href="#">编辑</a>&nbsp;&nbsp;<a href="#" class="d1">删除</a></td></tr>
$(".c1").parents("tr");//它的父级 如ttd的父级是tr tr这个父亲 

如：
<style>
.bk{
background-color:red;
}
</style>
$(this).addClass("bk");//添加一个Css样式

$(this).removeClass("css样式名")  如("bk");

$("input:first").focus(function(){
		$(this).val("");
	})

$("input").keypress(function(){
                var k=event.keyCode;
                alert(k);
            })

$("input:first").blur(function(){
	代码
})

$("form").submit(function(){
    alert("提交");
});

<form action="https://www.baidu.com/s" method="GET">
        <input type="text" name="wd" id="in1" required>
        <input type="submit" value="提交" />
    </form>

$("[name='username']"); name是属性名称=属性名称
$("[price]").css("font-size","100px");//属性为price的
$("li[price!='3000']").css("font-size","100px");//属性price不等于... 只有不等于和等于

function 回调函数     data是指服务器响应的信息
$.get("url地址",function(data){
	alert(data)
})

$.post("url地址",{数据1名称：数据1的值,数据2名称：数据2的值....},function(data)){
	alert(data)
}
列题：
function del(id){
	if(confirm("确认删除嘛？")){
		$.post("CarServlet",{"type":"del","id":id},function(data){
			/* showall();//调用此方法  把33换成调用此方法 */
			alert("删除成功！");
			/* location.href = location.href; */
			showall();
		})
	}
}

$.post("servlet",{"type":"edit","id":id,"cna":cname,"cum":cnumber,"co":color},function(ed){
                    if(ed=="u3"){
//成功操作
                        var ii = layer.load();
                        //此处用setTimeout演示ajax的回调
                        setTimeout(function(){
                            layer.close(ii);
                        }, 500);
                        layer.closeAll(function(){ //关闭所有层并执行回调
                            layer.msg("编辑成功！");
                            //刷新
                            cx();
                        });

                    }
                });

function getbook(){
	$.get("类servlet",function(data){
		//将json字符串转换成jsno对象
		var books=JSON.parse(data);
		for(var i=0;i<books.length;i++){
			var obj=books[i];//获取数组中的元素 这个元素是一个js的对象
			document.write(obj.id+"--"+obj.name+"---"+obj.price+"<br>");//输出
		}
	})
}
列：
function getbook(){
	$.get("BookServlet",function(data){
		$("#d1").text(data);
		//将json字符串转换成jsno对象
		var books=JSON.parse(data);
		//循环遍历获取元素
		for(var i=0;i<books.length;i++){
			var obj=books[i];//获取数组中的元素 这个元素是一个js的对象 
			//输出获取到的元素 
			document.write(obj.id+"--"+obj.name+"---"+obj.price+"<br>")
		}
		
		//$.parseJSON(data) 也可以使用 3.0弃用了
		/* var vg=$.parseJSON(data);
		for(var i=0;i<vg.length;i++){
			var obj=vg[i];
			document.write(obj.id+"--"+obj.name+"---"+obj.price+"<br>")
		} */
	})
}

$(this).parents("tr").remove()

location.href = location.href;

var st=$("#chk1").is(":checked");

var chlist=$("[name='ckcar']");
	var idstr="";
	
	for(var i=0;i<chlist.length;i++){//遍历所有的复选框
		var cf=chlist[i].checked;//得到每个复选框的状态
		/* alert(cf); */
		if(cf==true){
			 var id=(chlist[i].value);
			 idstr+=id+",";
		}
	}

$("[name='ckcar']").prop("checked",true);//设置为选中 prop为设置 

$("[name='ckcar']").removeAttr("checked",false); 

一个事件 onreadystatechange



网页如何发消息给服务器

cf.send(值); post请求
//get请求  cf.open("请求方式","请求地址","true/false") true//异步  false同步
var myname=document.querySelector("#name").value;
	cf.open("get","AjaxServlet?name="+myname,true);
	cf.send(); 
	
	
--get请求发送数据
//get请求发送数据到服务器                        true异步  false同步
	/* 
	cf.open("get","AjaxServlet?name="+myname,true);
	cf.send();
	
	*/



var xm=new XMLHttpRequest();
function co(){
//触发事件去发送数据
xm.open("请求方式","请求的地址","true/false")
xm.send()//发送
}
//准备事件改变是时 得到它返回的值
xm.onreadystatechange=function(){
/**
0: 请求未初始化
1: 服务器连接已建立
2: 请求已接收
3: 请求处理中
4: 请求已完成，且响应已就绪

200：ok 
404:未找到页面



**/
	if(cf.readyState==4 && cf.status==200){
		//执行的代码
	}
}



upn.innerHTML=http.responseText;--响应文本

//post请求发送数据到服务器 
cf.open("post","AjaxServlet",true);
//必须需要这行  请求头
cf.setRequestHeader("Content-type","application/x-www-form-urlencoded");
cf.send("na="+myname);

--- ajax02

AJAX 返回复杂的数据时？？？

ajax json对象

BbcDaoimpl imp=new BbcDaoimpl();
//json
	Gson gs=new Gson();
	//查询地区
	protected void sere(HttpServletRequest request, HttpServletResponse response) throws ServletException, IOException, SQLException {
		// TODO Auto-generated method stub
		response.setContentType("text/html;charset=UTF-8");
		/* response.setContentType("application/json;charset=UTF-8"); */
		List list=imp.sere();
		String json=gs.toJson(list);//将list转换成string
		/* response.setContentType("text/html;charset=UTF-8"); */
		response.getWriter().write(json);
	}
	
string转json  -- JSON.parse(值)
String json=gs.toJson(list);//将list转换成string

下拉框改变时  元素值发生改变时

onchange="chang()" //下拉框改变时  元素值发生改变时
删除行 deleteRow(下标) 

Math.floor返回小于等于x的最大整数
var d = Math.floor(time/60/60/24);//得到天
var h = Math.floor(time/60/60%24);//得到小时
var m = Math.floor(time/60%60);//得到分钟
var s = Math.floor(time%60);//得到秒数