Jquery中常见的DOM中的方法

Jquery:

选择器(选择页面上的标签) $('div') $('#id') $('.class')

访问DOM方法：(选择页面上的标签)

-----------------------------------------------------------------

操纵DOM：

document.getElementById('id') 和 $('#id') 有区别

$('#id') 是jquery又做了一层封装 ---

$('#id')[0]

$('#id').get(0) 是和 document.getElementById('id') 完全相同的

.attr('属性名')

选择器.attr('属性名') 获取属性值

选择器.attr('属性名','值') 给属性赋值

.prop('属性名')

选择器.prop('属性名') 获取属性值

选择器.prop('属性名','值') 给属性赋值

.attr(map) ---- attr({'value':'abc','name':'xxx'}) 同时给多个属性赋值

.attr('属性',function) 把function 的返回值赋给 属性

----------------------------------------------------------------

removeAttr()

removeAttr(attribute) 删除属性

-----------------------------------------------------

.css('css属性') 获取标签的css属性

.css('css属性','值') 给标签的css属性赋值 document.getElementById('').style.css属性

.css(map)

.css(property, function)

-----------------------------------------------------

.addClass(css的class选择器)

.removeClass()

.toggleClass() 原来有就删除 没有就增加

------------------------------------------------

html() 取值

html('') 赋值

相当于innerHTML

----------------------------------------------

.text() 取标签夹含的文本内容

.text('') 给标签增加文本内容

------------------------------------------------

.val() 相当于 .value ------- .attr('value')

.val('') .value= .attr('value','xxx')

================================================================================

prepend()

prependTo()

.....

-----------------------------------------------------------------

绑定事件：

.bind('事件名',function(){

$(this) 事件源

})

.bind('事件名',{key:'xxx'},function(event){

alert(event.data.msg); // event ---事件

})

unbind() 解除绑定

var timesClicked = 0;

$('#foo').bind('click', function(event) {

alert('The quick brown fox jumps over the lazy dog.');

timesClicked++;

if (timesClicked >= 3) {

$(this).unbind(event); // event事件

}

});

.one() 绑定事件， 只会执行一次

.trigger('事件名') 触发事件

window.onload=function(){

}

$(document).ready(function(){})

$().ready(function(){})

$(function(){})

.click(function(){}) .bind('click',function(){})

.dblclick(function(){}) .bind('dblclick',function(){})

.mouseover(function(){}) .bind('mouseover',function(){})

...

--------------------------------------------------------------------------

.show('slow',function(){})

.hide('slow',function(){})

.toggle('slow',function(){})

fadeIn()

fadeOut()

fadeTo()

animate({})

===================================================================================