jQuery001:jQuery中css,attr和prop的用法;jQuery和DOM对象的转化

  • 为了简化javascript的开发,一些javascript库诞生了。jQuery不是一门新的语言,而是把js进行封装,通过调用jQuery能够做出一些非常好看的特效。所以它是一个前端框架。它是轻量级的js库(压缩后只有21k),这是其他js库所不及的!它兼容各大浏览器
    当今流行的javascript库有:jQuery, (诞生于2005年)Dojo,EXT_JS
    DWR,YUI…
  • 示范一个简单的jQuery:
    首先需要导入jQuery类库:
    可以下载jQuery类库,并在本地导入
    在连网状态下,直接导入远程jQuery类库
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.5/jquery.min.js"></script>

这就是一个简单的jQuery代码,想使用jQuery,必须先引入jQuery库,jQuery库其实就是有个普通的js文件而已。
在这里插入图片描述
它也可以写成这种方式,这种就是纯粹的jQuery代码。这里的css指的是style里面有的属性才能用css。它既可以设置值,又可以获取值,当获取值的时候,只写一个参数,不写参数值
在这里插入图片描述
当多个css同时作用时,它可以简写。css方法调用完,会返回操作的元素,所以可以链式调用
在这里插入图片描述

  • 获取属性值:当不写值的时候,可以通过属性获取到属性值。这里的attr能设置可以在html直接点出来的属性,不是通过style获取的属性。下面表示滚动方式从左往右
    在这里插入图片描述

  • Prop()的使用,可以操作复选框选种和去掉
    有些属性只有一个属性值,当我们需要默认选中的时候可以点那个属性值,但是我们想完成过一段时间再去掉默认的时候,用css和attr实现不了。所以我们需要prop来实现。
    在这里插入图片描述

  • 什么是jQuery对象
    jQuery对象是通过jQuery包装DOM对象后产生的对象
    如果一个对象是jQuery对象,那么它就可以使用jQuery里的方法,比如
    $(“#test”).html()
    以上代码等价于以下代码
    document.getElementById(“test”).innerHTML;
    虽然jQuery对象是包装DOM对象后产生的,但jQuery对象不能使用任何DOM对象的方法,同样DOM对象也不能使用jQuery中的方法,乱用会报错.

  • DOM对象转化成jQuery对象
    jQuery对象是把DOM对象包装以后,产生的对象(装饰设计模式)。把DOM对象转化成jQuery对象,就可以使用jQuery里面封装的方法。这种是最常见的
    在这里插入图片描述
    把DOM对象传入$()方法,就会得到一个jQuery对象

  • jQuery对象转DOM对象:它发生转型之后是一个集合。哪怕是只有一个也会放到集合里面去,证明他是集合最好的方式是他可以.length。这种方式不常用。

  • 第一种转化方式:这里的下标是从0开始的
    在这里插入图片描述

  • 第二种转换方式:这种就比较像数组,也是从下标为0开始的
    在这里插入图片描述

  • 0
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值