jQuery d4
jQuery
一.介绍
jQuery是一套跨浏览器的JavaScript库，简化HTML与JavaScript之间的操作。他的特点 动态特效 AJAX 通过插件来扩展方便的工具 - 例如浏览器版本判断渐进增强链式调用多浏览器支持，支持Internet Explorer6.0+、Opera9.0+、Firefox2+、Safari2.0+、Chrome1.0+（在2.0.0中取消了对Internet Explorer6,7,8的支持），是一种十分使用的库，优化了javaScript，使用起来简单方便。
二.初识
首先他是javaScript的，所以应该写在对应的地方，在学习的时候通常写在前面《style》里，在使用的时候先要输入一段
<script type="text/javascript" src="../script/jquery-1.7.2.js"></script>，导入对应的库，在进行调用。
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd"> <html> <head> <meta http-equiv="Content-Type" content="text/html; charset=UTF-8"> <title>HelloWorld</title> <script type="text/javascript"> window.onload = function(){ var btn = document.getElementById("btnId"); btn.onclick = function(){ alert("hello"); }; }; </script> <!-- 引入jQuery库 --> <script type="text/javascript" src="../script/jquery-1.7.2.js"></script> <script type="text/javascript"> //$(function(){})相当于window.onload $(function(){ //为btnId绑定一个单击响应函数 //$("#btnId") 相当于 document.getElementById("btnId"); $("#btnId").click(function(){ alert("你好"); }); }); </script> </head> <body> <button id="btnId">SayHello</button> </body> </html>
可以由库得到这个//$(function(){})相当于window.onload，可以看出他比一般的javaScript要简单许多，方便使用，但需要注意的是每个符号的对映。
三.核心函数
首先，他可以传入html创建到本html中，$("html").appendTo("");你可以传递一个手写的 HTML 字符串，或者由某些模板引擎或插件创建的字符串，也可以是通过 AJAX 加载过来的字符串。
其次，他可以通过查找关键字（可以使标签，类，id或者其他选择器）找到想要的代码，再进行简单的css，这样就可以简单的控制了。
这个函数接收一个包含 CSS 选择器的字符串，然后用这个字符串去匹配一组元素。jQuery 的核心功能都是通过这个函数实现的。 jQuery中的一切都基于这个函数，或者说都是在以某种方式使用这个函数。这个函数最基本的用法就是向它传递一个表达式（通常由 CSS 选择器组成），然后根据这个表达式来查找所有匹配的元素。
<html> <head> <meta http-equiv="Content-Type" content="text/html; charset=UTF-8"> <title>核心函数</title> <script type="text/javascript" src="../script/jquery-1.7.2.js"></script> <script type="text/javascript"> //核心函数的4个作用 //$是jquery中核心函数，它一共四种作用，它可以根据传递参数的不同起不同的作用 //传入参数为[函数]时：在文档加载完成后执行这个函数 $(function(){ //传入参数为[HTML字符串]时：根据这个字符串创建元素节点对象 $("<div>this</div>").appendTo("body"); $("p").css("background-color","red"); //传入参数为[选择器字符串]时：根据这个字符串查找元素节点对象 //#id .class tagName $("#btn").click(function(){ alert("click me"); }); //传入参数为[DOM对象]时：将DOM对象包装为jQuery对象返回 var btnEle=document.getElementById("btn"); //dom对象指通过原生的JS代码获取到对象 //jQuery对象指通过jQuery核心函数获取到对象 var $btn=$("#btn"); //DOM-->jQuery; $(btnEle).click(function(){ alert($(btnEle)); }); //jQuery-->DOM; var $abc=$("p"); alert($abc[0]); //jQuery对象中为我们提供了非常多的方法，但是dom对象并不能调用这些 }) </script> </head> <body> <button id="btn">按钮</button> <p>assa</p> </body> </html>
有时需要用到dom对象有时又需要用到jQuery对象，可以将两个对象进行转换，通常定义jQuery对象有$,由于它可以对一类操作，而其至调用了一个css不需要将它便利，这样可以把它理解成一个数组，而dom对象需要便利就把它当作单个元素，当元素想变成数组时，直接让他成为数组即可。当数组想变成元素时需要调出每一个附成一个值。
所以dom转jQuery只要在前面加一个$,而jQuery变dom就需要取他当中的元素了，也就【i】；从0开始。
package com.neuedu.java; //饿汉形式 public class SingleTon {//以空间换时间 //1.构造私有化 SingleTon(){ } //2。提供一个当前类型的变量并赋值为当前类对象 private static SingleTon singleTon=new SingleTon(); //3.提供一个静态方法，让外界使用这类对象 public static SingleTon getInstance(){ return singleTon; } } //单例懒汉式 class Single {//存在线程安全性。以时间换空间 //1.构造私有化 private Single(){ } //2。提供一个当前类型的变量并赋值为当前类对象 private static Single single=null; //3.提供一个静态方法，让外界使用这类对象 // public synchronized static Single getInstance(){ // if(single==null){ // single=new Single(); // } // // return single; // // }
// public static Single getInstance(){
//
// synchronized (Single.class){
// if(single==null){
// single=new Single();
// }
// }
// }
// return single;
// }
public static Single getInstance(){ if(single==null)
{//第一次创建效率还是比较低，但是创建以后就大大提供速度了。
synchronized (Single.class){ if(single==null)
{ single=new Single();
}
}
}
return single;
}
}
package com.neuedu.java; public class Student { public static void main(String[] args){ SingleTon a=SingleTon.getInstance(); SingleTon b=SingleTon.getInstance(); System.out.println(a==b); Single c=Single.getInstance(); Single d=Single.getInstance(); System.out.println(c==d); } }
未完待续。
