jQuery和JavaScript

学习方法
困难和瓶颈
套路 
操纵元素 和 事件
表单
  1 怎么在网页上定义:<form acion="" method="" id="" name="">
  2 脚本怎么得到表单的表单元素对象：
      var oForm = document.getElementById('id');
      var oForm = document.form[0]  得到一个装有form表单的数组
  var oForm = document.form['name'];
  var oForm = id
jQuery  
  var $oForm = $(#"id")
  var $oForm = $(["name='name']")
   $oForm.submit();
   $oForm.reset();
   $oForm.valid();//要求这个表单验证  前提条件  jQuery.validate.js 插件




 3 有什么用？
    oForm.submit(); //提交表单   onsubmit 事件无效
    oForm.reset();  //重置表单  Form所有控件恢复原来的状态


表单字段：   表单元素 就是表单里面这些控件
  <input>  <select>   <textarea>


var oElement = oForm.elements[0];
var oElement = oForm[0];
var oElement = oForm['name'];
var oElement = oForm.id;
var oElement = document.getElementById("id");


jQuery
var $oElement = $("#id");
3 共性 或者特色
id name class
type 只有input
value select只读
disabled 控件： 标签里面 disabled="disabled=" JS代码  oElement.disabled = true;
form 我属于哪个form标签 父标签


focus() 获得焦点 键盘可以操控的状态 触发 onfucus() 通知浏览器
blur() 失去焦点 触发onblur
onchange 控件被改变，失去焦点


onmouseenter  鼠标进入
onmouseout      鼠标离开
mousemove      事件通过鼠标在元素上移动来触发。事件处理函数会被传递一个变量——事件对象，其.clientX 和 .clientY 属性代表鼠标的坐标
mouseover        事件会在鼠标移入对象时触发
mouseup            事件会在鼠标点击对象释放时


onclick     点击 不限于鼠标 键盘也能弄出来
ondbclick  双击事件


键盘事件
onkrydown  键盘按下
onkeyup     键盘弹起
onkeypress 按键事件




  事件的语法
       标签内:   <......onXXX="代码"/>
      JS代码内： oElement.onXXX = function(){}
       jQuery:     $oElement.XXX(function(event){代码}) ; 要写在ready()事件里面


事件代码可以有返回值  最好是布尔值  true false
如果返回的是true 表示事件的默认动作继续做下去
如果返回的是flase 表示事件的默认动作终止
默认返回值是true


     $().ready(function(){
      事件代码
});


事件.which       事件键入的字母的ASC码
ASCII
'a' 97
'A' 65
'0' 48


最好网页上  只有标签  JSTL 核心标签库 EL
从body标签 只能有标签


每个控件都有特色的属性
   文本框： <input type="text" ..../>
    value  getElementById()    val()
选中文字 select();  JS代码和jQuery代码都一样 照样触发onselect事件
    onselect事件: 返回值无效。不影响选择效果


组合框 下拉框    组合框 属性multiple="multiple"
       写标签：<input type="text" οnselect=""/>
      JS代码:  id1.txt1.onselect = function(){代码}
      jQuery:  $("#txt1").select(function(){代码});


当文本框中文本被选中时执行的函数:


jQuery 代码:
$(":text").select( function () { /* ...do something... */ } );










核心
jQuery 核心函数
jQuery([sel,[context]]) 
jQuery(html,[ownerDoc]) 
jQuery(callback) 
jQuery.holdReady(hold)1.6+ 
jQuery 对象访问
each(callback) 
size() 
length 
selector 
context 
get([index]) 
index([selector|element]) 
数据缓存
data([key],[value]) 
removeData([name|list])1.7* 
$.data(element,[key],[value]) 
队列控制
queue(element,[queueName]) 
dequeue([queueName]) 
clearQueue([queueName]) 
插件机制
jQuery.fn.extend(object) 
jQuery.extend(object) 
多库共存
jQuery.noConflict([ex]) 
属性
属性
attr(name|pro|key,val|fn) 
removeAttr(name) 
prop(name|pro|key,val|fn)1.6+ 
removeProp(name)1.6+ 
CSS 类
addClass(class|fn) 
removeClass([class|fn]) 
toggleClass(class|fn[,sw]) 
HTML代码/文本/值
html([val|fn]) 
text([val|fn]) 
val([val|fn|arr]) 
CSS
CSS
css(name|pro|[,val|fn]) 
位置
offset([coordinates]) 
position() 
scrollTop([val]) 
scrollLeft([val]) 
尺寸
heigh([val|fn]) 
width([val|fn]) 
innerHeight() 
innerWidth() 
outerHeight([soptions]) 
outerWidth([options]) 
选择器
基本
#id 
element 
.class 
* 
selector1,selector2,selectorN 
层级
ancestor descendant 
parent > child 
prev + next 
prev ~ siblings 
基本
:first 
:last 
:not(selector) 
:even 
:odd 
:eq(index) 
:gt(index) 
:lt(index) 
:header 
:animated 
:focus1.6+ 
内容
:contains(text) 
:empty 
:has(selector) 
:parent 
可见性
:hidden 
:visible 
属性
[attribute] 
[attribute=value] 
[attribute!=value] 
[attribute^=value] 
[attribute$=value] 
[attribute*=value] 
[attrSel1][attrSel2][attrSelN] 
子元素
:nth-child 
:first-child 
:last-child 
:only-child 
表单
:input 
:text 
:password 
:radio 
:checkbox 
:submit 
:image 
:reset 
:button 
:file 
:hidden 
表单对象属性
:enabled 
:disabled 
:checked 
:selected 
文档处理
内部插入
append(content|fn) 
appendTo(content) 
prepend(content|fn) 
prependTo(content) 
外部插入
after(content|fn) 
before(content|fn) 
insertAfter(content) 
insertBefore(content) 
包裹
wrap(html|ele|fn) 
unwrap() 
wrapall(html|ele) 
wrapInner(html|ele|fn) 
替换
replaceWith(content|fn) 
replaceAll(selector) 
删除
empty() 
remove([expr]) 
detach([expr]) 
复制
clone([Even[,deepEven]]) 
筛选
过滤
eq(index|-index) 
first() 
last() 
hasClass(class) 
filter(expr|obj|ele|fn) 
is(expr|obj|ele|fn)1.6* 
map(callback) 
has(expr|ele) 
not(expr|ele|fn) 
slice(start,[end]) 
查找
children([expr]) 
closest(expr,[con]|obj|ele)1.6* 
find(expr|obj|ele)1.6* 
next([expr]) 
nextall([expr]) 
nextUntil([exp|ele][,fil])1.6* 
offsetParent() 
parent([expr]) 
parents([expr]) 
parentsUntil([exp|ele][,fil])1.6* 
prev([expr]) 
prevall([expr]) 
prevUntil([exp|ele][,fil])1.6* 
siblings([expr]) 
串联
add(expr|ele|html|obj[,con]) 
andSelf() 
contents() 
end() 
事件
页面载入
ready(fn) 
事件处理
on(eve,[sel],[data],fn)1.7+ 
off(eve,[sel],[fn])1.7+ 
bind(type,[data],fn) 
one(type,[data],fn) 
trigger(type,[data]) 
triggerHandler(type, [data]) 
unbind(type,[data|fn]) 
事件委派
live(type,[data],fn) 
die(type,[fn]) 
delegate(sel,[type],[data],fn) 
undelegate([sel,[type],fn]) 1.6* 
事件切换
hover([over,]out) 
toggle(fn, fn2, [fn3, fn4, ...]) 
事件
blur([[data],fn]) 
change([[data],fn]) 
click([[data],fn]) 
dblclick([[data],fn]) 
error([[data],fn]) 
focus([[data],fn]) 
focusin([data],fn) 
focusout([data],fn) 
keydown([[data],fn]) 
keypress([[data],fn]) 
keyup([[data],fn]) 
mousedown([[data],fn]) 
mouseenter([[data],fn]) 
mouseleave([[data],fn]) 
mousemove([[data],fn]) 
mouseout([[data],fn]) 
mouseover([[data],fn]) 
mouseup([[data],fn]) 
resize([[data],fn]) 
scroll([[data],fn]) 
select([[data],fn]) 
submit([[data],fn]) 
unload([[data],fn]) 
效果
基本
show([speed,[easing],[fn]]) 
hide([speed,[easing],[fn]]) 
toggle([speed],[easing],[fn]) 
滑动
slideDown([spe],[eas],[fn]) 
slideUp([speed,[easing],[fn]]) 
slideToggle([speed],[easing],[fn]) 
淡入淡出
fadeIn([speed],[eas],[fn]) 
fadeOut([speed],[eas],[fn]) 
fadeTo([[spe],opa,[eas],[fn]]) 
fadeToggle([speed,[eas],[fn]]) 
自定义
animate(param,[spe],[e],[fn]) 
stop([cle],[jum])1.7* 
delay(duration,[queueName]) 
设置
jQuery.fx.off 
jQuery.fx.interval 
ajax
ajax 请求
$.ajax(url,[settings]) 
load(url,[data],[callback]) 
$.get(url,[data],[fn],[type]) 
$.getJSON(url,[data],[fn]) 
$.getScript(url,[callback]) 
$.post(url,[data],[fn],[type]) 
ajax 事件
ajaxComplete(callback) 
ajaxError(callback) 
ajaxSend(callback) 
ajaxStart(callback) 
ajaxStop(callback) 
ajaxSuccess(callback) 
其它
$.ajaxSetup([options]) 
serialize() 
serializearray() 
工具
浏览器及特性检测
$.support 
$.browser 
$.browser.version 
$.boxModel 
数组和对象操作
$.each(object,[callback]) 
$.extend([d],tgt,obj1,[objN]) 
$.grep(array,fn,[invert]) 
$.sub() 
$.when(deferreds) 
$.makearray(obj) 
$.map(arr|obj,callback)1.6* 
$.inarray(val,arr,[from]) 
$.toarray() 
$.merge(first,second) 
$.unique(array) 
$.parseJSON(json) 
函数操作
$.noop 
$.proxy(function,context) 
测试操作
$.contains(container,contained) 
$.type(obj) 
$.isarray(obj) 
$.isFunction(obj) 
$.isEmptyObject(obj) 
$.isPlainObject(obj) 
$.isWindow(obj) 
$.isNumeric(value)1.7+ 
字符串操作
$.trim(str) 
URL
$.param(obj,[traditional]) 
插件编写
$.error(message) 
关于
关于此jQuery中文文档 
提交bug及获取更新 
Deferred
def.done(donCal,[donCal]) 
def.fail(failCallbacks) 
def.isRejected() 
def.isResolved() 
def.reject(args) 
def.rejectWith(context,[args]) 
def.resolve(args) 
def.resolveWith(context,[args]) 
def.then(doneCal,failCals)1.7* 
def.promise([type],[target])1.6+ 
def.pipe([donl],[fai],[pro])1.7* 
def.always(alwCal,[alwCal])1.6+ 
def.notify(args)1.7+ 
def.notifyWith(con,[args])1.7+ 
def.progress(proCal)1.7+ 
def.state()1.7+ 
Callbacks
cal.add(callbacks)1.7+ 
cal.disable()1.7+ 
cal.empty()1.7+ 
cal.fire(arguments)1.7+ 
cal.fired()1.7+ 
cal.fireWith([context] [, args])1.7+ 
cal.has(callback)1.7+ 
cal.lock()1.7+ 
cal.locked()1.7+ 
cal.remove(callbacks)1.7+ 
$.callbacks(flags)1.7+ 
其它
正则表达式