/**
* //dom常用操作,DOM操作
* get() 就是把JQ轉成原生js
* outterWidth();
* 類似原生offsetWidth :獲取不到隱藏元素(display:none)的值
* text();
* remove();
* detach()跟remove一樣,不過會保留刪除這個元素的操作行爲
* parents()獲取當前元素的所有祖先節點
* closest()獲取最近的指定的祖先節點包括元素自身,必須要寫篩選的參數,只能找到一個元素
* siblings()
* nextAll()下面所有的兄弟節點
* prevAll()
* parentsUntil() 到什麼爲止
* nextUntil()
* prevUntil()
* clone(true) 可以接收一個參數,作用:可以複製之前的操作行爲
* warp() 外包裝
* warpAll()
* warpInner 內包裝
* unwarp()刪除包裝刪除父級,不包括body
* add()
* slice() 截取
* serialize()
* serializeArray()
* //運動
* animate()
* 第三個參數:swing(默認)
* linear
* 第四個參數 callback
*
* stop() 默認阻止當前運動
* stop(true) 阻止後續的運動
* stop(true,true) 可以立即停止到指定的目標點
* finish()可以立即停止到所有指定的目標點
*
* delay()
* //事件委託
* delegate //優點:省略了循環操作,對後續添加的內容應用了事件操作
* undelegate() //阻止事件委託
*
* trigger //觸發被選中元素的指定事件
* ev.data e.target ev.type
*/
alert($(".div").get()[0].innerHTML);
window.onload = function(){
}
$(function(){
//等DOM加載完
})
||
$(document).ready(function(){
//等DOM加載完
})
//delegate
$("li").on("click",function(){
// event
})
$("ul").delegate("li","click",function(){
// event
$("ul").undelegate(); //阻止事件委託
})
$("div").click(function(){ })
$("div").trigger('click'); //主動觸發
$(".div").on("click",{name:'hello'},function(ev){
alert(ev.data.name); //hello
alert(ev.type); //click
alert(ev.target); //事件源
})
<pre name="code" class="javascript">/**
* $.xx(); 工具方法不僅可以jquery用,原生JS 也可以
*
* $.type()可以返回具體類型
* $.trim()去掉空格
* $.inArray()類似於indexOf
* $.porxy()改變this指向
* $.noConflict()防止衝突
* $.parseJSON()
* $.makeArray()
*
* //插件
* $.extend 擴展工具方法下的插件形式 $.xxx()
* $.fn.extend : 擴展到JQ對象下的插件 $().xxx()
*/
var a = "string";
alert(typeof a);
alert($.type(a));
var arr = ['a','b','c','d'];
alert($.inArray('w',arr)); //-1
function show(n1,n2){
alert(n1);
alert(n2);
alert(this); //window
}
$.proxy(show,document)(); //document
$.proxy(show,document)(3,4); //3,4
$.proxy(show,document,3,4)(); //3,4
$.proxy(show,document,3)(4); //3,4
$(document).click($.proxy(show,window,3,4)); //window
//noConflict
var fun = $.noConflict();
fun(function(){
})
//ajax
$.ajax({
url : 'xx.php',
data : 'name=xxx&age=xxx',
type : 'POST',
success : function(){
},
error : function(){
}
})
// $.extend
$.extend({
leftTrim : function(){
return str.replace(/^\s+/,'');
}
})
$.leftTrim()
//$.fn.extend()
$.fn.extend(function(){
darg : function(){
var disX = 0;
var disY = 0;
var This = this
this.mousedown(function(ev){
var disX = ev.pageX-$(this).offset().left;
var disX = ev.pageX-$(this).offset().top;
document.mousemove(function(){
this.css('left',ev.pageX-disX);
this.css('top',ev.pageY-disY);
})
document.mouseup(function(){
$(this).off();
})
return false;
})
}
})
$("div").drag();