在我开始写之前，我想强调的是，在jquery和js中单引号和双引号并没有区别！！！

选择器

#id：$('#id')
element: $('element')
.class: $('.class')
*: $(' * ')(找到页面中的所有元素)

属性

attr：

<em title="huge, gigantic">large</em>

以上有一个em标签，这时，我们可以使用$('em').attr('title'),可以获取到title的属性值
$('em').attr('title','hello world'),可以把title的属性修改为 hello world
还可以把一个对象传进去，给em标签同时设置几个属性，$('em').attr({ active:"beijing is big" name:"my name is sunying" });

removeAttr


<img src="test.jpg"/>

将图像中的src属性移出掉，$('img').removeAttr('src');

prop

这个属性用在input框和单选复选框中，

<input type="checkbox" checked="checked">
20.  <input type="checkbox">
21.  <input type="checkbox">
22.  <input type="checkbox" checked="checked">

禁用上面的所有的复选框，$('input[type='checkbox']').prop({ disabled:true //如果是false，则不禁用 })

removeprop

常用来移出用prop查找的属性， $('input').removeProp('checked')

css类

addClass

正如字面上的意思，就是给一个标签添加一个属性：

语法：$('div').addClass('active') 表示给div标签添加一个active的css样式

removeClass

正如字面上意思，给一个元素移出一个css样式：

语法：$('div').removeClass('active')表示移出div中的active这个css样式

toggleClass

这个方法是切换样式的意思，经常配合点击事件来使用：

例如：

$('div').click(funciton(){
    $(this).toggleClass('active')
})
表示点击这个div时，切换active这个样式

获取内容/改变内容

html（）

语法：$('p').html('你想给这个元素添加的内容')

位置

offset

获取当前元素相对与页面的坐标，也可以用它来设置元素相对与页面的位置。

返回值：top和left

语法：

$('div').offset()
$('div').offset({ top:10, left:20 })

position

获取到当前元素相对于offset parent的坐标。(offset parent指离该元素最近的而且被定位过的祖先元素 )

返回值：top和left

语法：$('div').position()

语法：$('div').position('left:'+position.left+',top:'+positon.top);

尺寸

innerHeight（）,innerWidth（）,outerHeight（）,outerWidth（），height（），width（）

区别：

innerHeight（）,innerWidth（）：获取的高宽不包括border和margin

outerHeight（）,outerWidth（）如果在括号里填写true的时候，就表示margin，padding，border全部都获取

height（），width（）就只获取到内容区域的高宽

文档处理

内部插入：append（），appendTo（），prepend（），prependTo（）

所谓的内部插入，就是在某个元素的内部插入内容。

例如：

<div calss="inner">Hello World</div>
<script>
$('.inner').append('<p> i like you</p>')

$('<p> i like you</p>').appendTo('.inner')

$('.inner').prepend('<p> i like you</p>')

$('<p> i like you</p>').prependTo('.inner')

</script>

效果，可以自己运行看。

以上就是他们的语法，不过，append与appendTo是插入到文档内部后面；prepend与prependTo是插入到文档的内部前面。

外部插入

所谓的外部插入，就是把想添加的元素添加到目标元素后面，构成兄弟结点元素。

after，before,insertAfter,insertBofore

<div class="inner">Hello</div>

<script>
$('.inner').after('<p>Test</p>');
$('.inner').before('<p>Test</p>');
$('<p>Test</p>').insertAfter('.inner');
$('<p>Test</p>').insertBefore('.inner');
</script>

老规矩，效果可以自行运行观看，

以上就是他们的语法，不过，after，before是插入到文档内部后面；insertAfter,insertBofore是插入到文档的内部前面。

克隆，复制

我个人觉得jquery的clone语法比js的好用...

clone()

clone()在jquery中是一种默认为深度拷贝的方法，不仅可以拷贝结构，内容，甚至连事件都可以拷贝...

$('.div').on('click',function(){
    console.log('111')
})

$('.div1').clone(true).append('.div')

效果可以自己运行观看，注意点：在clone（）括号中不加true，是浅克隆（克隆结构和内容），加了true，是深克隆（不仅可以克隆结构和内容，还可以克隆事件）。

查找

这是在jquery中经常用到的东西，用来查找和锁定元素

children（）

获取到的是当前元素下的所有子元素

next（）

下一个兄弟元素

nextall（）

下面所有的兄弟元素

parent

父级元素

parents

向上匹配到所有的祖先元素

prev（）

上一个兄弟元素

prevall（）

网上匹配到的所有的兄弟元素

sibiling（）

匹配到除了自己的所有兄弟元素

jQuery常用语法总结（上）