Java web：JQuery+xml+Tomcat基本知识框架

---

前言：

jQuery:javaScript Query,目的是简化 javaScript 编程

XML 被设计用来传输和存储数据。与配置文件properties的作用相似，语法与HTML相似

JavaWeb是指，所有通过 Java 语言编写可以通过浏览器访问的程序的总称

简单讲就是用java以及相关知识做网站开发

javaWeb 容器 == 服务器,tomcat 就是一种轻量级的服务器

---

也就是搭建java web。
需要：前端：html+css+javascript+jQuery
配置各种信息：xml
服务器搭建：tomcat
后端逻辑处理：java、servlet等等

---

一、jQuery

<!--
    jQuery:javaScript Query,目的是简化 javaScript 编程

    在事件响应的 function函数中，有一个this对象。
    这个this对象是当前正在响应事件的dom对象 
    return false；可以阻止元素的默认行为


    1. $
      是jQuery 的核心函数，能完成 jQuery 的很多功能。$()就是调用$这个函数
      获取对象值：var name = $("#empName").val();
      直接剑建一个行标签对象：var $trobj=s(<tr>表格</tr>);
    
    2. jQuery 对象和 dom 对象
      javascrpit 出来的对象就是DOM对象，经过jQuery函数出来的就变成了jQuery对象
      jQuery 对象 = dom 对象的数组 +jQuery 提供的一系列功能函数。
      jQuery 通过数组下标取出就是 DOM 对象

    3. jQuery 选择器,同 javascript
        |-- 基本选择器
            $("#id"),id选择器，返回对应id的对象
            $(".class")，类选择器，返回对应类的对象
            $("label")，标签选择器，返回对应标签的对象

        |-- 层级选择器
            ancestor descendant 后代选择器 ：在给定的祖先元素下匹配所有的后代元素 
            parent>child 子元素选择器：在给定的父元素下匹配所有的子元素 
            prev+next 相邻元素选择器：匹配所有紧接在 prev 元素后的 next 元素 
            prev~sibings 之后的兄弟元素选择器：匹配 prev 元素之后的所有 siblings 元素

    4. jQuery 过滤器,类似于伪元素 ::first
        |-- 基本过滤器
            :first 	，$("div:first")		
            :last 			
            :not(selector) 	
            :even 			
            :odd 			
            :eq(index)		 
            :gt(index) 		
            :lt(index) 		
            :header 		
            :animated 

        |-- 内容过滤器
            :contains(text)  ，$("div:contains('di')")，含有文本'di'的div元素
			:empty 			  
			:has(selector) 	
            :parent ，$("div:parent")含有子元素的div
            
        |-- 可见性、属性、表单对象过滤器
            :hidden 、:visible  
            [attribute=value]，$("div[title='test']")，属性title值等于'test'的div元素

        |-- 元素筛选
            first() 					
	        last() 						
            hasClass(class) 
            closest(expr,[con]|obj|ele)1.6*   
            find(expr|obj|ele) 

        例如：select[name=sel01] :selected表示名字叫sel01的选择框的被选元素
              select[name=sel01] option表示名字叫sel01的选择框的option元素

    

    5. jQuery的DOM属性操作
        |--页面属性
            html() 它可以设置和获取起始标签和结束标签中的内容。 同innerHTML 
            text() 它可以设置和获取起始标签和结束标签中的文本。 同innerText
            val() 它可以设置和获取表单项的 value 属性值。 同value
            例如：
            获取选中状态：$(":checkbox").val(["checkbox3","checkbox2"]); 

        |-- 获取设置属性的值
            attr()
            prop()
            设置多选框，并设置选中状态为选中，$(":checkbox").prop("checked",true); 

            例如设置反选按钮：
                $("#checkedRevBtn").click(function(){
                    //用each来获取每一个的选中状态
                    $("[name = 'items']").each(function () {
                        this.checked = !this.checked;
                    });
                    //再将全选的按钮也设置上
                    var stat = $("[name = 'items']:checked").length==4;
                    $("#checkedAllBox").attr("checked",stat)

                });
        |-- 增删查改
            appendTo(content)
            prependTo(content)

            insertAfter(content)
            insertBefore(content)

            replaceWith(content|fn)
            replaceAll(selector)
            
            empty()
            remove([expr])
        
            例如：$(this).appendTo("select[name=sel02]");将eah中的对象转移到框2中去
        
    6. jQuery设置CSS动画效果，
        |-- 添加样式
            addClass() 添加样式 ，里面放在CSS中编写好的样式。
            removeClass() 删除样式 
            toggleClass() 有就删除，没有就添加样式。 
            offset() 获取和设置元素的坐标。

        |-- 添加动画效果，里面添加参数，设置动画时间和回调函数
            show() 将隐藏的元素显示 
            hide() 将可见的元素隐藏。 
            toggle() 可见就隐藏，不可见就显示。
            fadeIn() 淡入（慢慢可见） 
            fadeOut() 淡出（慢慢消失） 
            fadeTo() 在指定时长内慢慢的将透明度修改到指定的值。0 透明，1 完成可见，0.5 半透明 
            fadeToggle() 淡入/淡出 切换

    7. jQuery的事件处理
        |-- 常用事件处理
            click() 它可以绑定单击事件，以及触发单击事件 
            mouseover() 鼠标移入事件 
            mouseout()  鼠标移出事件 
            bind() 可以给元素一次性绑定一个或多个事件。 
            one() 使用上跟 bind 一样。但是 one 方法绑定的事件只会响应一次。 
            unbind() 跟 bind 方法相反的操作，解除事件的绑定 
            live() 也是用来绑定事件。
                它可以用来绑定选择器匹配的所有元素的事件。
                哪怕这个元素是后面动态创建出来的也有效

        |-- 事件的冒泡
            父子元素同时监听同一个事件。当触发子元素的事件的时候，同一个事件也被传递到了父元素的事件里去响应。
            阻止事件冒泡
            在子元素事件函数体内，return false; 

        |-- 获取事件对象
            在给元素绑定事件的时候，参数列表中添加一个参数，function(event)，此event就是事件对象

二、xml

<!--
    XML

    XML 被设计用来传输和存储数据。与配置文件properties的作用相似，语法与HTML相似
    HTML 被设计用来显示数据。

    1. XML标签
       声明文件：<?xml version="1.0" encoding="utf-8"?>
       没有预定义的标签，可以自定义
       注意：大小写敏感、属性必须加引号，关闭标签不能掉、位置不能混乱
    
    2. XML元素
       从（且包括）开始标签直到（且包括）结束标签的部分。如：<title>Harry Potter</title>
   
    3. XML中，尽量避免使用属性。优先使用元素。
     属性不能包含多个值、不能包含树结构、不易扩展
     元数据（有关数据的数据）应当存储为属性，而数据本身应当存储为元素
       属性：<person sex="female">
       元素：<sex>female</sex>

    4. 解析XML的dom4j,第三方解析技术
        |-- 创建 Saxreader对象。这个对象，用于读取xml文件，并创建 Document
            Saxreader reader =new Saxreader O)
            Document document =reader read(src/books.xml);

        |-- 遍历标签获取所有标签中的内容
            第一步，通过 Document对象。拿到XML的根元素对象
                   Element root =document.getrootelement();

            第二步，通过根元素对象。获取所有的book标签对象元素
                List<element> books =rootelements("book");
                Element nameelement =book.element("name);
            
            第三步，通过 gettext()方法获取每一个元素的文本内容
                name = nameelement.gettext();
-->

三、Tomcat

<!--
    Tomcat

    1.javaweb
    JavaWeb是指，所有通过 Java 语言编写可以通过浏览器访问的程序的总称
    简单讲就是用java以及相关知识做网站开发
    javaWeb 容器 == 服务器,tomcat 就是一种轻量级的服务器

    2.常用的web资源
        静态资源： html、css、js、txt、mp4 视频 ,jpg 图片
        动态资源： jsp 页面、Servlet 程序

    3.安装目录介绍
        bin 专门用来存放 Tomcat 服务器的可执行程序 
        conf 专门用来存放 Tocmat 服务器的配置文件 
        lib 专门用来存放 Tomcat 服务器的 jar 包 
        logs 专门用来存放 Tomcat 服务器运行时输出的日记信息 
        temp 专门用来存放 Tomcdat 运行时产生的临时数据 
        webapps 专门用来存放部署的 Web 工程。 
        work 是 Tomcat 工作时的目录，用来存放 Tomcat 运行时jsp翻译为Servlet的源码，和 Session 钝化的目录。

    4.IDEA 整合 Tomcat 服务器
       创建动态 web 工程


-->