attributes和properties的区别
attributes 是 XML 结构中的属性节点概念范畴：
<body onload="prettyPrint()"></body>
上面的代码表示了 body 这个节点，有一个名为 onload 的 attributes 。
properties 则是对于 DOM 对象的，对象属性概念范畴。这一般就没有直观的表现，但是它总是可以被访问到的，比如：
$('body').get(0).tagName;
//BODY
虽然 attributes 与 properties 是不同的概念范畴，但是它们对于某些特殊的属性是有共同的访问属性名的，比如 id 。
类与属性控制
.addClass() .hasClass() .removeClass()
添加一个类，判断是否有指定类，删除类
$('body').addClass('test');
$('body').addClass(function(index, current){return current + 'new'});
$('body').removeClass('test');
$('body').removeClass(function(index, current){return current + ' ' + 'other'});
.toggleClass()
类的开关式转换，它的使用方法有多种：
$('img').toggleClass(); //对所有类的开关 $('img').toggleClass('test'); //对指定类的开关 $('img').toggleClass(isTrue); //根据isTrue判断所有类的开关 $('img').toggleClass('test', isTrue); //根据isTrue判断指定类的开关 //同 $('img').toggleClass('test') 只是类名由函数返回 $('img').toggleClass(function(index, class, isTrue){return 'name'}); //isTrue会作为函数的第三个参数传入 $('img').toggleClass(function(index, class, isTrue){return 'name'}, isTrue);
.attr()
获取或者设置一个属性值，它的使用方法有多种：
$('#greatphoto').attr('alt'); //获取属性 $('#greatphoto').attr('alt', 'Beijing Brush Seller'); //设置属性 //同时设置多个属性 $('#greatphoto').attr({ alt: 'Beijing Brush Seller', title: 'photo by Kelly Clark' }); //设置属性为函数返回值, 函数的上下文为当前元素 $('#greatphoto').attr('title', function(i, val) { return val + ' - photo by Kelly Clark'; });
.prop()
用法同 .attr() ，只是对象变成了 properties
.removeAttr() .removeProp()
删除属性
.val()
设置或获取元素的表单值，通常用于表单元素。
$('input').val();
$('input').val('other');
.html()
设置或获取元素的节点文件本值。
测试$('div').html(); $('div').html('测试'); $('div').html(function(index, old){return old + '另外的内容'});
样式控制
.css()
获取或设置指定的 css 样式：
$('body').css('background-color');
$('body').css('background-color', 'red');
$('body').css('background-color', function(index, value){return value + '1'});
$('body').css({color: 'green', 'background-color': 'red'});
.width() .height()
获取或设置元素的宽和高
$('body').width();
$('body').width(50);
$('body').width(function(index, value){return value += 10});
.innerWidth() .innerHeight() .outerHeight() .outerWidth()
元素的其它尺寸值
.scrollLeft() .scrollTop()
获取或设置滚动条的位置
.offset() .position()
获取元素的坐标。 offset 是相对于 document ， position 是相对于父级元素
结构控制
文本节点
.html() .text()
设置和获取节点的文值。设置时 .text() 会转义标签，获取时 .text() 会移除所有标签。
子节点
.append() .prepend()
Greetings
$('.inner').append('HelloGoodbyeTest
');Greetings
HelloTest
GoodbyeTest
参数可以有多种形式：
var $newdiv1 = $(''),
newdiv2 = document.createElement('div'),
existingdiv1 = document.getElementById('foo');
$('body').append($newdiv1, [newdiv2, existingdiv1]);
兄弟节点
.after() .before()
$('.inner').after('Greetings
HelloGoodbyeTest
');Greetings
HelloTest
GoodbyeTest
父节点
.wrap() .wrapAll() .wrapInner()
$('.inner').wrap('');HelloGoodbye$('.inner').wrapAll('');HelloGoodbye$('.inner').wrapInner('');HelloGoodbyeHelloGoodbye
复制/删除/替换节点
.clone()
复制节点，可选参数表示是否处理已绑定的事件与数据
.clone(true)
处理当前节点的事件与数据
.clone(true, true)
处理当前节点及所有子节点的事件与数据
.detach()
暂时移除节点，之后可以再次恢复了指定位置。
.remove()
永久移除节点。
.empty()
清除一个节点的所有内部内容。
.unwrap()
移除节点的父节点。