前端开发之JQuery入门基础操作

技术前端开发之JQuery入门基础操作 前端开发之JQuery入门基础操作下载JQuery
目前jQuery有三个大版本:
1.x:兼容ie678,使用最为广泛的,官方只做BUG维护,功能不再新增。因此

面向前端开发的JQuery基本操作。

下载JQuery

jQuery目前有三个主要版本:

1.x:兼容应用最广泛的ie678,官方只做BUG维护,没有新增功能。因此,对于一般项目,使用1.x版本是可以的,

2.x:与很少使用的ie678不兼容。官方只做BUG维护,没有新增功能。如果不考虑与低版本浏览器的兼容性,可以使用2.x,

3.x:与ie678不兼容,只支持最新的浏览器。除非特别要求,否则不会使用3.x版本,这是许多旧的jQuery插件不支持的。目前这个版本是以更新维护为主的官方版本。

注意:jquery-xxx.js和jquery-xxx.min.js的区别:jquery-xxx.js是开发版,是给程序员看的,有很好的缩进和注释,还有更大的前端培训. Jquery-XXX . min . js:生产版,用在程序中,没有缩进,体积更小,程序加载更快。

导入JQuery的js文件

直接导入min.js文件。例如:

脚本src=' js/jquery-3 . 3 . 1 . min . js '/脚本

JQuery对象和JS对象

差异与转化。

差异

JQuery对象操作起来更方便。

JQuery对象和js对象的方法并不常见。

转化

Jq-js: Jq对象[index]或jq对象。get(索引)。

Js-jq: $ (js对象)

JQuery的简单使用

事件绑定。

比如点击id为B的按钮,弹出提示框。

JQuery代码如下:

$('#b ')。单击(函数(){ 0

警报(' b ');

});

功能相同的JS代码如下,很明显JS代码比较复杂。

document.getElementById('b ')。onclick=function(){ 0

警报(' b ');

}

进入功能

入口函数是当前页面加载后运行的函数。JQuery代码如下:

$(function(){ 0

警报(“页面加载完成”);

});

而JS代码如下:

window . onload=function(){ 0

警报(“页面加载完成”);

};

注意:window.onload和$(函数)的区别:window.onload只能定义一次,如果定义多次,后者会覆盖前者;和$(function)可以多次定义。

风格控制。

例如,将id为div1的元素的背景颜色设置为红色。JQuery代码如下:

$('#div1 ')。css('背景色','红色');

或者:

$('#div1 ')。css('backgroundColor ',' red ');

相当于JS代码:

document . getelementbyid(' div 1 '). style . background COlOr=' red ';

内容来源网络,如有侵权,联系删除,本文地址:https://www.230890.com/zhan/62049.html

(0)

相关推荐

  • oracle12c中如何导入java的jar文件

    技术oracle12c中如何导入java的jar文件这篇文章主要介绍oracle12c中如何导入java的jar文件,文中介绍的非常详细,具有一定的参考价值,感兴趣的小伙伴们一定要看完! 1、

    攻略 2021年11月11日
  • 从Python转到Go语言理由有哪些

    技术从Python转到Go语言理由有哪些本篇内容介绍了“从Python转到Go语言理由有哪些”的有关知识,在实际案例的操作过程中,不少人都会遇到这样的困境,接下来就让小编带领大家学习一下如何处理这些情况吧!希望大家仔细阅

    攻略 2021年12月1日
  • Android消息机制Handler用法有哪些

    技术Android消息机制Handler用法有哪些这篇文章主要讲解了“Android消息机制Handler用法有哪些”,文中的讲解内容简单清晰,易于学习与理解,下面请大家跟着小编的思路慢慢深入,一起来研究和学习“Andr

    攻略 2021年11月30日
  • leetcode数组找最大数(leetcode排序中查找元素)

    技术LeetCode如何在排序数组中查找元素的第一个和最后一个位置这篇文章主要介绍LeetCode如何在排序数组中查找元素的第一个和最后一个位置,文中介绍的非常详细,具有一定的参考价值,感兴趣的小伙伴们一定要看完! 一

    攻略 2021年12月15日
  • 如何进行分布式事务Seata Saga模式以及三种模式

    技术如何进行分布式事务Seata Saga模式以及三种模式如何进行分布式事务Seata Saga模式以及三种模式,很多新手对此不是很清楚,为了帮助大家解决这个难题,下面小编将为大家详细讲解,有这方面需求的人可以来学习下,

    攻略 2021年10月20日
  • Windows 9x屏幕取词的实现方法是什么

    技术Windows 9x屏幕取词的实现方法是什么Windows 9x屏幕取词的实现方法是什么,针对这个问题,这篇文章详细介绍了相对应的分析和解答,希望可以帮助更多想解决这个问题的小伙伴找到更简单易行的方法。有关屏幕取词"

    攻略 2021年11月24日