jQuery基础知识小结

2020-05-24 21:19:46易采站长站整理

  $(:input)包括input, select, textarea, button元素
  $(tr:parent)
  $(input:password)等同于$(input[type=password])
  $(input:radio)等同于$(input[type=radio])
  $(input:reset)等同于$(input[type=reset])或$(button[type=reset])
  $(‘.clssname:selected’)
  $(input:submit)等同于$(input[type=submit])或$(button[type=submit])
  $(input:text)等同于$(input[type=text])
  $(div:visible)

3、处理DOM元素  

 操作元素的属性:

  $(‘*’).each(function(n){
   this.id = this.tagName + n;
  })
 

获取属性值:$(”).attr(”);

 设置属性值:

  $(‘*’).attr(‘title’, function(index, previousValue){
   return previousValue + ‘ I am element ‘ + index + ‘ and my name is ‘ + this.id;
  }) 为一个属性设置值
  $(‘input’).attr({
   value: ”,
   title: ”
  }); 为多个属性设置值

 删除属性:

  $(‘p’).removeAttr(‘value’);
 让所有链接都在新窗口中打开:
  $(‘a[href^=”http://”]’).attr(‘target’,”_blank”);

 避免表单多次提交:
  $(“form”).submit(function(){
   $(“:submit”, this).attr(“disabled”,”disabled”);
  })

 添加类名:$(‘#id’).addClass(”)

 删除类名:$(‘#id’).removeClass(”)

 切换类名:$(‘#id’).toggleClass(”)存在就删除类名,不存在就添加类名

 判断是否含有类名:$(‘p:first’).hasClass(”) $(‘p:first’).is(”)

 以数组形式返回类名列表:
  $.fn.getClassNames = function(){
   var name = this.attr(‘someclsssname’);
   if(name != null){
    return name.split(” “);
   }
   else
   {
    return [];
   }
  }

 设置样式:
  $(‘div.someclassname’).css(function(index, currentWidth){
   return currentWidth + 20;
  });
  $(‘div’).css({
   cursor: ‘pointer’,
   border: ‘1px solid black’,
   padding: ’12px 12px 20px 20x’,
   bacgroundColor: ‘White’
  });