jQuery

初识jQuery

  什么是jQuery?
      它是一个轻量级的javascript类库（就一个类“jQuery”，简写“$”）

  jQuery的优点：
      1 、总是面向集合
      2 、多行操作集于一行

  hello jQuery
      1 、导入js库<script type="text/javascript" src=""></script>
      2、 $(fn)做为程序入口

  探究$(fn)、$(document).ready(fn)与window.onload的区别？
      $(fn)、$(document).ready(fn)它们是等价的，哪个代码在前面哪个就哪个先执行，jsp的dom树结构加载完毕即刻调用方法    window.onload最后执行 jsp的dom树加载完，css、js等静态资源加载完毕执行。项目维护时需要用到。

  jQuery三种工厂方法
      jQuery(exp[,context])
      exp：选择器
      context：上下文，环境/容器，documemt
  选择器：
      标签选择器：

$(function(){
 $("a").click(function(){
  alert("哈哈");
 })
})

      ID选择器：

$(function(){
 $("#a1").click(function(){
  alert("哈哈");
 })
})

      类选择器

$(function(){
 $(".a1").click(function(){
  alert("哈哈");
 })
})

      包含选择器：E1 E2

$(function(){
 $("p a").click(function(){
  alert("哈哈");
 })
})

      组合选择器：E1,E2,E3

$(function(){
 $("a,span").click(function(){
  alert("哈哈");
 })
})

  $就是jQuery简写

  jQuery程序的入口

$(document).ready(fn)

$(fn);

  this指针的作用
      1 、事件源（获取当前按钮的按钮值）
      2 、当前元素（点击按钮，获取所有a标签的值）

插件机制简介

      往jquery类库里面去扩展方法，这类方法就是jquery插件
的三种格式：
      1 、对象 {sid:‘s01’,sname:‘zs’}
      2 、列表/数组 [1,3,4,5]
      3 、混合模式 {id:3,hobby:[‘a’,‘b’,‘c’]}
  **$.extend和$.fn.extend**
  1、$.extend：对象的扩展(或继承)
$.extend(obj1,obj2,obj3[,…])
$.extend(obj1,obj2)
$.extend(obj1)/$.method=function(options){…};

2 $.fn.extend
$.fn.extend(obj1)//$.fn.method=function(options){…};

  jQuery插件的添加
      其实就是给jQuery添加新的实例方法或类方法，然后将功能封闭在其中

后台json的三种格式的体现形式

package com.liyi;

import java.util.ArrayList;
import java.util.HashMap;
import java.util.List;
import java.util.Map;

import com.fasterxml.jackson.core.JsonProcessingException;
import com.fasterxml.jackson.databind.ObjectMapper;
import com.liyi.entity.Student;
/**
 * 后台json的三种格式的体现形式
 * @author 224李毅
 */
public class Demo1 {
	 public static void main(String[] args) throws JsonProcessingException {
	  //json对象
	  Student stu1 = new Student("s001", "张三");
	  ObjectMapper om = new ObjectMapper();
	  System.out.println(om.writeValueAsString(stu1));
	  //json数组
	  Student stu2 = new Student("s002", "李四");
	  List<Student> list1 = new ArrayList<>();
	  list1.add(stu1);
	  list1.add(stu2);
	  System.out.println(list1);
	  //json混合格式
	  Map<String, Object> map = new HashMap<>();
	  map.put("total", 2);
	  map.put("stus", list1);
	  System.out.println(om.writeValueAsString(map));
	 }
}

javaBean与Map集合转换成json字符串格式是一样的

package com.liyi;
import java.util.ArrayList;
import java.util.HashMap;
import java.util.List;
import java.util.Map;
import com.fasterxml.jackson.core.JsonProcessingException;
import com.fasterxml.jackson.databind.ObjectMapper;
/**
 * javaBean与Map集合转换成json字符串格式是一样的
 * @author 224李毅
 *
 */
public class Demo2 {
	 public static void main(String[] args) throws JsonProcessingException {
	  Map<String, Object> stu1 = new HashMap<>();
	  stu1.put("sid","s001");
	  stu1.put("sname", "张三");
	  ObjectMapper om = new ObjectMapper();
	  System.out.println(om.writeValueAsString(stu1));
	  
	  List<Map<String, Object>>list1 = new ArrayList<>();
	  Map<String, Object> stu2 = new HashMap<>();
	  stu2.put("sid","s0021");
	  stu2.put("sname", "李四");
	  list1.add(stu1);
	  list1.add(stu2);
	  System.out.println(om.writeValueAsString(list1));
	 }
}

json死循环问题：

package com.liyi;

import java.util.HashSet;
import java.util.Set;

import com.fasterxml.jackson.core.JsonProcessingException;
import com.fasterxml.jackson.databind.ObjectMapper;

import com.liyi.entity.Student;
import com.liyi.entity.Teacher;
/**
 * json死循环问题
 * 1、又双向绑定改成单向绑定，也就说将彼此之间的关系交于一方维护
 * 2、@JsonIgnore：将彼此循环调用的属性忽略，不参与对象转成json格式
 * @author 224李毅
 *
 */  
public class Demo3 {
	 public static void main(String[] args) throws JsonProcessingException {
	  Student stu1 = new Student("s001", "aa");
	  Student stu2 = new Student("s002","bb");
	  
	  Teacher tea1 = new Teacher("s001", "11", null);
	  Teacher tea2 = new Teacher("s002", "22", null);
	  Set<Teacher>teas = new HashSet<>();
	  teas.add(tea1);
	  teas.add(tea2);
	  stu1.setTeas(teas);
	  Set<Student> stus = new HashSet<>();
	  stus.add(stu1);
	  stus.add(stu2);
	  tea1.setStus(stus);
	  ObjectMapper om = new ObjectMapper();
	  System.out.println(om.writeValueAsString(stu1));
	 }
}

好啦，今天的更新就到这了，喜欢点赞+转发~