关于Jquery的一点小东西

JavaScript使得能够在前端中添加java代码
JQuery是JS的一个框架，创建一个mian.js文件，在里面编写js代码
并且在main.html的标签中添加

<script type="text/javascript" src="main.js"></script>

将该js应用到main.html中。

入口函数

$(function(){
	//js代码
});

获取文本框的值

var value=$("input#id").val();

为文本框赋值

var value=$("input#id").val("赋值");

为标签添加文本

$("p#id").html("内容");

获取后台返回的json数据

var host="http://localhost:8080/";
$.getJSON(host+"customerservice/accesscard/get",{cardno:cardnpo},function(as){
     $("input#cardnoSee").val(as.cardno);
    if(password.equals(as.password)...
     });
  //"customerservice/accesscard/get"：controller层中json数据路径
  //cardno:cardnpo：cardno为表的一个字段，cardnpo为js文件的一个变量
  //as：返回的数据存储到这个变量中
  //这个语句的意思：查询目标表中字段cardno的值为cardnpo的数据，并且将返回的json数据存储到变量as中

获取字符串长度

userid.length

判断字符串是否相等，如果字符串类型不相等，他还会自动转换类型

var A="156516516";
var B="5165161665";
if(A==B);//

页面跳转
单页面web应用，A页面中嵌套了B页面

//连同A页面弃用，整个页面实现跳转，B的js有
window.location.href='b.html';
//只跳转B页面，保留A页面，那B页面的js有
self.location.href='b.html'

在HTML中插入html语句

//原语句: <div id="divjs"></div>

$("div#divjs").append("<p>添加的内容</p>");

//修改后: <div id="divjs"> <p>添加的内容</p> </div>

为html添加表格

//模拟json数据
var tablehead=["用户ID","用户名字"];
//表头输出
for(var i=0;i<tablehead.length;i++){
$("table#usertable").append("<th>"+tablehead[i]+"</th>");
}
//成员行输出
$.getJSON(host+"User/get/listall",function(us){
for(var i=0;i<us.length;i++){
$("table#usertable").append(
"<tr>"+
"<td>"+us[i].userid+"</td>" +
"<td>"+us[i].username+"</td>" +
"</tr>");
}
});

获取鼠标选中行的数据

$("table tr").on("click",function() {
	var td = $(this).find("td");// 找到td元素
	var id = td[0].innerHTML;// 指定需要获取元素的下标即可，这样获取到选中行的第一列
	alter(id);
});

但上面的方法不能为jQuery动态append元素增加点击事件，若想改为可以为动态append元素增加点击事件，如下

$("table#usertable").on("click","tr",function() {
	var td = $(this).find("td");// 找到td元素
	var id = td[0].innerHTML;// 指定需要获取元素的下标即可
	alter(id);
});

执行简单的POST请求(这里有一个问题，如果post返回的不是json数据[默认]，那回调函数function是不会执行的)

$.post( url, [data], function(){
	//回调函数
	}, [type] ) //使用POST方式来进行异步请求

删除html表格

//选中行
 var td;
 $("table#usertable").on("click","tr",function() {
        td = $(this).find("td");// 找到td元素
    });
 //删除行
 $("button#delete").on("click",function(){
 //再从html中直接把那一行删掉
  td.remove();
  $("p#operation").html("删除成功！");
 });

html中<input>标签读取的都是string