jq一些知识点

//文档加载完成后执行方法

1   

  $(function(){
    $('h1').html('88')
   })

2  

  $(document).read(function(){
    $('h1').html('88')
  })

3.  整个内容载入(包括图片)如果图片过大会影响响应效率 

  window.onload = function(){

  }

/*jq 和dom的区别
jq获取的元素是个数组,数组中包含原生js中的dom对象
*/
//索引值大于3
  $('h1:gt(3)').css('background','red')
//索引小于3
  $('h1:lt(3)').css('background','blue')
//索引等于3
  $('h1:eq(3)').css('background','green')
  $('h1').eq(3).css('background','black')
// 索引为奇数
  $('h1:odd').css('background','red')
//索引为偶数
  $('h1:even').css('background','green')
// 选择第一行
  $('h1:first').css('background','black')
//选择最后一行
  $('h1:last').css('background','black')
// 查找元素的后代元素
  $('h1').find('li').css('background','green')
// 查找该元素的直接子元素
  $('h1').children('li').css('background','green')
// 查找元素的兄弟元素
  $('h1').siblings('li').css('background','green')
// 查找父元素
  $('h1').parent('li').css('background','green')

// 获取h1系列的第index个,并给他添加个active ,同时将其他的h1同级元素移除掉active
  $('h1').eq(index).addClass('active').siblings().removeClass('active')

// jq修改样式和操作类  若属性由多个单词组成,则用引号引起, 若属性由多个单词组成,则用驼峰命名
  $('h1:last').css({
    color:"red",
    border:"2px solid #ccc",
    "border-radius":"10px",
    backgroundImage:"url(img/下载.jpg)"
  })
// 获取样式属性
  var getColor = $('h1').css('color')


// 切换类 有就删除,没有就添加
  if($('h1').hashClass('active')){
    $('h1').removeClass('active')
  }else{
    $('h1').addClass('active')
  }
//等同于
  $('h1').toggleClass('active')

上一篇:ubuntu18.04安装CUDA


下一篇:从零开始学VUE之VueRouter(Router-link 详解)