jquery

引入<script src=”jquery.js”></script> 放在自己的js上面

选择器：同css选择器；

$(‘#id’)；id选择器

$(‘p’); 元素选择器

$(‘[href=”#”]’) 属性选择器

;$(‘.class’) 类选择器

事件

$(‘p’).click(function(){});//点击事件

mouseover：鼠标移上

mouseout 鼠标移开

hover(function(){},function(){}); （鼠标移上，鼠标移开）

$(this)的使用，指当前元素

获取和赋值

获取内容:text();html();val();

设置赋值：text(val);html(val);val(val);

获取属性：attr();

设置赋值：attr(‘href’,val);

css()设置或返回样式的属性；

返回属性css(‘proname’)

设置单个属性css(‘proname’,’val’)

设置多个属性css({‘pr1’:’val1’,’pr2’:’val2’})

获取内容:text();html();val();

$(‘#p’).text();//只获取文本

$(‘#p’).html();//获取p里面子元素的标签和内容都获取

 设置赋值：text(val);html(val);val(val);

$(‘#p’).text(‘海边’);//直接替换

$(‘#p’).html($(‘#p’).html()+'<b>jiacu</b>';);//输出改变jiacu

获取属性：attr(‘href’);//获取属性值

$(‘#p’).attr('title','提示');//鼠标移入时显示提示

设置赋值：attr(‘href’,val);

css()设置或返回样式的属性；

返回属性css(‘proname’)      //$(‘#id’).css(‘height’)，获取height

设置单个属性css(‘height’,’20px’)   //$(‘#id’).css(‘height’，‘20px’)

设置多个属性css({‘height’:’20px’,’width’:’20px’})   //$(‘#id’).css({‘height’：‘20px’，‘width’：‘20px’})

加class名class=‘s’：$(‘#id’).addClass(‘s’)

移出class名：$(‘#id’).removeClass()

判断id里面是否有class名为s的值：$(‘#id’).hasClass(‘s’)

$(‘div’).toggle();

 如果div里面有class就删除，如果没有class就添加

获取宽高

$(div).width();$(div).height();（内容的宽高）

$(div).innerWidth()宽度（包括内边距）

$(div).innerHeight()高度（内容加高度）

$(div).outerWidth()宽度（包括内边距和边框）

$(div).outerHeight()宽度，包括内边距和边框

添加删除元素

$(div).append(要插入的内容):在被选元素结尾插入内容，在原标签内

$(div).prepend(要插入的内容):在被选元素的开头插入内容  在原标签内

$(div).after(要插入的内容):在被选元素之后插入内容； 在原标签的外面

$(div).before(要插入的内容)：在被选元素之前插入内容； 在原标签的外面

$(div).remove():删除自己（及其子元素）；

$(div).empty():删除被选元素的子元素；

$(div).on(‘click’,function(){});动态事件

 动态失态可以给后添加的元素添加事件

遍历

祖先:$(div).parent(); 只获取一个

$(div).parents()所有的父级都获取，可以在（）加条件

后代:$(div).children();只获取向下一层的元素

$(div).find()所有的子元素，在（条件）

同胞:$(div).siblings();不包含自己的同级元素

$(div).next();同级的下一个元素

$(div).prev();同级的上一个元素

过滤：$(div).first(）选中的第一个元素

$(div).last() 选中的最后一个元素；

$(div).eq() 选中改位置的的元素（类似于数组）