为了账号安全,请及时绑定邮箱和手机立即绑定
  • 为什么最后一个新增文本出现在第二个div里,因为倒数第二个操作“通过.html()方法替换html结构”把第一个div里的html内容全部替换成了文本,所以第一个div里已经没有a元素了,所以第二个div里的第一个a元素变成了全文档的第一个a元素,在最后一个操作里选择器.left a:first找到的a元素就是第二个div里的a元素。

  • 通过标准的JavaScript操作DOM与jQuery操作DOM的对比,我们不难发现:

    1. 通过jQuery方法包装后的对象,是一个类数组对象。它与DOM对象完全不同,唯一相似的是它们都能操作DOM。
    2. 通过jQuery处理DOM的操作,可以让开发者更专注业务逻辑的开发,而不需要我们具体知道哪个DOM节点有那些方法,也不需要关心不同浏览器的兼容性问题,我们通过jQuery提供的API进行开发,代码也会更加精短。


    查看代码快照
  • $(document).ready 的作用是等页面的文档(document)中的节点都加载完毕后,再执行后续的代码,因为我们在执行代码的时候,可能会依赖页面的某一个元素,我们要确保这个元素真正的的被加载完毕后才能正确的使用。

    查看代码快照
  • jQuery是一个JavaScript脚本库,不需要特别的安装,只需要我们在页面 <head> 标签内中,通过 script 标签引入 jQuery 库即可。


    查看代码快照
  • $(document).ready 的作用是等页面的文档(document)中的节点都加载完毕后,再执行后续的代码,因为我们在执行代码的时候,可能会依赖页面的某一个元素,我们要确保这个元素真正的的被加载完毕后才能正确的使用。

  • //is 原声的写法 var a = document.getElementById(“test”); a.style.css(“color”,”red”); //jquery的写法 var b = $(“#test”); b.css(“color”,”red”);
  • jquery对象是一个类数组对象,也就是一个数组,每一个元素是dom元素; 通过下标或者get()方法获取dom元素。
  • 其中的switch 为布尔值,决定添加或删除类式

  • 不难想到$(".imooc").css()方法内部肯定是带了一个隐式的循环处理,

  • 剑神_小小谢

    @Zz皓 天才!
    为什么没效果呢?因为CDN引用的是以http开头的链接,然而页面显示却是https,协议相冲突了,那么当然就会报错啦。只需要在http后面加个s那么就会有效果了


  • 可维护性:

    .addClass()的本质是通过定义个class类的样式规则,给元素添加一个或多个类。css方法是通过JavaScript大量代码进行改变元素的样式

    通过.addClass()我们可以批量的给相同的元素设置统一规则,变动起来比较方便,可以统一修改删除。如果通过.css()方法就需要指定每一个元素是一一的修改,日后维护也要一一的修改,比较麻烦

    灵活性:

    通过.css()方式可以很容易动态的去改变一个样式的属性,不需要在去繁琐的定义个class类的规则。一般来说在不确定开始布局规则,通过动态生成的HTML代码结构中,都是通过.css()方法处理的

    样式值:

    .addClass()本质只是针对class的类的增加删除,不能获取到指定样式的属性的值,.css()可以获取到指定的样式值。

    样式的优先级:

    css的样式是有优先级的,当外部样式、内部样式和内联样式同一样式规则同时应用于同一个元素的时候,优先级如下

    外部样式 < 内部样式 < 内联样式
    1. .addClass()方法是通过增加class名的方式,那么这个样式是在外部文件或者内部样式中先定义好的,等到需要的时候在附加到元素上

    2. 通过.css()方法处理的是内联样式,直接通过元素的style属性附加到元素上的

    通过.css方法设置的样式属性优先级要高于.addClass方法

    总结:

    .addClass与.css方法各有利弊,一般是静态的结构,都确定了布局的规则,可以用addClass的方法,增加统一的类规则
    如果是动态的HTML结构,在不确定规则,或者经常变化的情况下,一般多考虑.css()方式


  • .toggleClass( )方法:在匹配的元素集合中的每个元素上添加或删除一个或多个样式类,取决于这个样式类是否存在或值切换属性。即:如果存在(不存在)就删除(添加)一个类

    1. .toggleClass( className ):在匹配的元素集合中的每个元素上用来切换的一个或多个(用空格隔开)样式类名

    2. .toggleClass( className, switch ):一个布尔值,用于判断样式是否应该被添加或移除

    3. .toggleClass( [switch ] ):一个用来判断样式类添加还是移除的 布尔值

    4. .toggleClass( function(index, class, switch) [, switch ] ):用来返回在匹配的元素集合中的每个元素上用来切换的样式类名的一个函数。接收元素的索引位置和元素旧的样式类作为参数

    注意事项:

    1. toggleClass是一个互斥的逻辑,也就是通过判断对应的元素上是否存在指定的Class名,如果有就删除,如果没有就增加

    2. toggleClass会保留原有的Class名后新增,通过空格隔开


  • 子选择器只对直接的子元素有作用

    而后代选择器包含除父元素以外的所有元素,包含子元素 孙元素

    而兄弟选择器的选择需要用classname 来引导位置

  • //id为menu_con元素 的第一个div元素 里面index为0的dd标签 的子元素中index小于4的a元素

  • addClass与css区别

    可维护性:

    .addClass()的本质是通过定义个class类的样式规则,给元素添加一个或多个类。css方法是通过JavaScript大量代码进行改变元素的样式

    通过.addClass()我们可以批量的给相同的元素设置统一规则,变动起来比较方便,可以统一修改删除。如果通过.css()方法就需要指定每一个元素是一一的修改,日后维护也要一一的修改,比较麻烦

    灵活性:

    通过.css()方式可以很容易动态的去改变一个样式的属性,不需要在去繁琐的定义个class类的规则。一般来说在不确定开始布局规则,通过动态生成的HTML代码结构中,都是通过.css()方法处理的

    样式值:

    .addClass()本质只是针对class的类的增加删除,不能获取到指定样式的属性的值,.css()可以获取到指定的样式值。

    样式的优先级:

    css的样式是有优先级的,当外部样式、内部样式和内联样式同一样式规则同时应用于同一个元素的时候,优先级如下

    外部样式 < 内部样式 < 内联样式
    1. .addClass()方法是通过增加class名的方式,那么这个样式是在外部文件或者内部样式中先定义好的,等到需要的时候在附加到元素上

    2. 通过.css()方法处理的是内联样式,直接通过元素的style属性附加到元素上的

    通过.css方法设置的样式属性优先级要高于.addClass
    方法

    总结:

    .addClass与.css方法各有利弊,一般是静态的结构,都
    确定了布局的规则,可以用addClass的方法,增加统一的
    类规则
    如果是动态的HTML结构,在不确定规则,或者经常变化的
    情况下,一般多考虑.css()方式
首页上一页1234567下一页尾页

举报

0/150
提交
取消
课程须知
1、有HTML/CSS基础 2、有JavaScript基础
老师告诉你能学到什么?
1、jQuery的基础语法 2、jQuery当中的选择器 3、jQuery中的属性和样式

微信扫码,参与3人拼团

意见反馈 帮助中心 APP下载
官方微信
友情提示:

您好,此课程属于迁移课程,您已购买该课程,无需重复购买,感谢您对慕课网的支持!