jQuery学习基础总结

1、jQuery选择器
   1.1、id选择器：$('#btnCheck')
   1.2、标签选择器：$('div')
   1.3、类选择器：$('.className')
   1.4、标签+类选择器：$('div.className')
   1.5、多条件选择器(组合、复合)：$('#id,target,.className')
   1.6、层选择器

2、事件添加方法
   $('选择器').事件名(function(){
   });
   比如：$('#btnCheck').click(function(){
       alert('Hello World');
   });

3、属性
   3.1、hasClass()检查被选元素释放包含制定的class(返回true/false)

　　　　公式：$('选择器').hasClass('','')

　　　　获取选择器的标签元素内容：$('选择器').hasClass(class);

   3.2、attr()属性值的设置与获取
        公式：$('选择器').attr('属性名'，'值');
       设置选择器的属性值，改变div的高度：$('选择器').attr('height'，'180');
       获取选择器的属性值,获取div的高度：$('选择器').attr('height');

　　3.3、removeAttr()移除元素属性

　　　　公式：$('选择器').removerAttr('属性名')

　　　　移除元素的属性：$('选择器').removerAttr('id');

　　3.4、html()方法被选元素的内容(innerHTML)设置或者返回

　　　　公式：$('选择器').html('','')

　　　　获取选择器的标签元素内容：$('选择器').html();

　　　　设置选择器的标签元素内容：$('选择器').html('Hello World');

　　3.5、val()方法设置或者获取元素的值

　　　　公式：$('选择器').val();

　　　　获取选择元素的值：$('选择器').val();

　　　　设置选择元素的值：$('选择器').val('Hello World');

　　3.6、addClass()设置或者获取元素的类

　　　　公式：$('选择器').addClass();

　　　　添加选择元素的类：$('选择器').addClass(class);

　　　　移除选择元素的类：$('选择器').removeClass('class').addClass

　　3.7、toggleClass()对元素进行切换

　　　　公式：$('选择器').toggleClass

　　　　切换元素类(前提做好两个类)：$('选择器').toggleClass(function(){

　　　　})

　　3.8、text()方法被选元素的内容(innerText)设置或者返回

　　　　公式：$('选择器').html('','')

　　　　获取选择器的标签元素内容：$('选择器').text();

　　　　设置选择器的标签元素内容：$('选择器').text('Hello World');

4、样式(CSS)

　　4.1、CSS()样式的获取与设置

　　　　公式：$('选择器').css(name,value)

　　　　获取选择器的标签元素样式属性：$('选择器').css('color');

　　　　设置选择器的标签元素样式内容：$('选择器').css('color','red');

　　　　设置元素多样式：$('选择器').css({

    　　 "color":"white",
    　　 "background-color":"#98bf21",
   　　   "font-family":"Arial",
   　　   "font-size":"20px",
   　　   "padding":"5px"

　　　　})

　　　　设置所有匹配的元素中样式属性的值：$('').css(name,function(index,value))

　　　　$('选择器').css('width',function(index,value){

　　　　return parseFloat(value)*1.2

　　　　})

来源：https://www.cnblogs.com/LiGengMing/p/5257008.html

标签

jquery name选择器

css选择器

jquery