ICode9

精准搜索请尝试: 精确搜索
首页 > 其他分享> 文章详细

jq一些知识点

2021-06-28 22:03:44  阅读:172  来源: 互联网

标签:知识点 元素 h1 jq green background active 一些 css


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

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')

标签:知识点,元素,h1,jq,green,background,active,一些,css
来源: https://www.cnblogs.com/alannero/p/14946501.html

本站声明: 1. iCode9 技术分享网(下文简称本站)提供的所有内容,仅供技术学习、探讨和分享;
2. 关于本站的所有留言、评论、转载及引用,纯属内容发起人的个人观点,与本站观点和立场无关;
3. 关于本站的所有言论和文字,纯属内容发起人的个人观点,与本站观点和立场无关;
4. 本站文章均是网友提供,不完全保证技术分享内容的完整性、准确性、时效性、风险性和版权归属;如您发现该文章侵犯了您的权益,可联系我们第一时间进行删除;
5. 本站为非盈利性的个人网站,所有内容不会用来进行牟利,也不会利用任何形式的广告来间接获益,纯粹是为了广大技术爱好者提供技术内容和技术思想的分享性交流网站。

专注分享技术,共同学习,共同进步。侵权联系[81616952@qq.com]

Copyright (C)ICode9.com, All Rights Reserved.

ICode9版权所有