解码jQuery系列1 - 变量和函数
- 格式:docx
- 大小:17.47 KB
- 文档页数:3
jquery 常见的字符串加解密方法在jQuery 中,并没有提供专门的字符串加解密方法。
字符串的加解密通常是通过JavaScript 的原生方法或者其他第三方库来实现的。
以下是一些常见的字符串加解密方法:1. Base64 编码解码:Base64 编码不是真正的加密,但它可以用于对字符串进行简单的编码和解码。
编码:```javascriptvar encodedString = btoa("Hello, World!"); // 编码```解码:```javascriptvar decodedString = atob(encodedString); // 解码```2. MD5 加密:MD5 是一种不可逆的哈希算法,用于生成字符串的固定长度散列值。
```javascriptfunction md5(string) {// 通过第三方库或实现MD5算法// 返回MD5散列值}```3. AES 加密解密:AES(Advanced Encryption Standard)是一种对称加密算法,常用于加密和解密数据。
```javascript// 使用第三方库CryptoJS 实现// https://cryptojs.gitbook.io/docs/var encrypted = CryptoJS.AES.encrypt("Hello, World!", "secretKey");var decrypted = CryptoJS.AES.decrypt(encrypted, "secretKey");var decryptedString = decrypted.toString(CryptoJS.enc.Utf8);```4. RSA 加密解密:RSA 是一种非对称加密算法,用于加密和解密数据。
```javascript// 使用第三方库jsencrypt 实现var encrypt = new JSEncrypt();encrypt.setPublicKey("-----BEGIN PUBLIC KEY-----\n ... \n-----END PUBLIC KEY-----");var encrypted = encrypt.encrypt("Hello, World!");var decrypt = new JSEncrypt();decrypt.setPrivateKey("-----BEGIN PRIVATE KEY-----\n ... \n-----END PRIVATE KEY-----");var decrypted = decrypt.decrypt(encrypted);```请注意,这些示例中使用的库(如CryptoJS、jsencrypt)需要在项目中引入并进行适当的配置。
jQuery变量的命名规则遵循一定的规范,以确保代码的可读性和可维护性。
以下是jQuery变量命名的几个要点:
1.只能由字母(A-Z、a-z)、数字(0-9)、下划线(_)和美元符号($)组成。
2.变量名区分大小写,因此A和a是两个不同的变量。
3.第一个字符必须是字母、下划线或美元符号。
不能以数字开头。
4.变量名中不能包含空格。
5.避免使用JavaScript保留字和关键字作为变量名。
6.建议使用驼峰命名法,即首个单词的首字母小写,后面单词的首字母大写。
例如,
myVariableName。
7.常量所有字母大写,多个单词用下划线分开。
例如,MY_CONSTANT。
8.jQuery对象和函数通常以开开开开开开开开开开开开element。
9.在HTML代码中,建议使用双引号("),而在JavaScript代码中,建议使用单引号(')。
遵循这些命名规则可以使你的代码更加清晰、易于理解和维护。
JavaScript变量、函数与原型链 定义 || 赋值 1-函数的定义 函数定义的两种⽅式: “定义式”函数:function fn(){ alert("哟,哟!"); } “赋值式”函数:var fn = function(){ alert("切可闹!"); } @页⾯加载时,浏览器会对JavaScript代码进⾏扫描,并将定义式函数进⾏预处理(类似C等的编译)。
【函数声明提升】 处理完再由上⾄下执⾏,遇到赋值式函数则只是将函数赋值给⼀个变量,不进⾏预处理,待调⽤时才进⾏处理。
@在定义前⾯调⽤函数时,定义式函数正常执⾏,赋值式函数会报错 (提⽰:oFn is not a function)。
2-变量与函数的定义 变量:①var a; 定义变量a。
②var a = 123; 定义变量a,再给变量a赋值。
函数:①function fn(...){...} 声明函数fn。
②var oFn = function(...){...} 先定义变量oFn和⼀个匿名函数,再将匿名函数赋值给变量oFn。
@定义变量和定义函数都会先预处理,变量赋值则是在执⾏中完成。
@定义变量的作⽤:只是指明变量作⽤域。
有定义没赋值的变量和使⽤没定义的变量值都为undefined。
@定义函数的作⽤:除了指明函数作⽤域,同时定义函数体结构——包括函数体内部的变量定义和函数定,此过程递归。
alert(a); //function a(){}alert(b); //function b(){}alert(c); //undefinedvar a = "a";function a() {}function b() {}var b = "b";var c = "c";var c = function() {}alert(a); //aalert(b); //balert(c); //function(){}①虽然第⼀个 alert(a) 在最前⾯,但是你会发现它输出的值竟然是 function a() {},这说明,函数定义确实在整个程序执⾏之前就已经完成了。
jquery常⽤函数与⽅法汇总1.delay(duration,[queueName])设置⼀个延时来推迟执⾏队列中之后的项⽬。
1.4新增。
⽤于将队列中的函数延时执⾏。
他既可以推迟动画队列的执⾏,也可以⽤于⾃定义队列。
duration:延时时间,单位:毫秒queueName:队列名词,默认是Fx,动画队列。
例:头部与底部动画效果$(document).ready(function() {$('#header') .css({ 'top':-50 }) .delay(1000).animate({'top': 0}, 800);$('#footer') .css({ 'bottom':-15 }) .delay(1000).animate({'bottom': 0}, 800);});2.jQuery live( type, fn ) 委派事件实现Query 1.3中新增的⽅法。
给所有当前以及将来会匹配的元素绑定⼀个事件处理函数(⽐如)。
也能绑定⾃定义事件。
⽬前⽀持 click, dblclick, mousedown, mouseup, mousemove, mouseover, mouseout, keydown, keypress, keyup。
还不⽀持 blur, focus, mouseenter, mouseleave, change, submit与bind()不同的是,live()⼀次只能绑定⼀个事件。
这个⽅法跟传统的bind很像,区别在于⽤live来绑定事件会给所有当前以及将来在页⾯上的元素绑定事件(使⽤委派的⽅式)。
⽐如说,如果你给页⾯上所有的li⽤live绑定了click事件。
那么当在以后增加⼀个li到这个页⾯时,对于这个新增加的li,其click事件依然可⽤。
⽽⽆需重新给这种新增加的元素绑定事件。
菜鸟教程jquery语法jQuery是一种高效、简洁又方便的JavaScript库,它简化了HTML文档的操作、事件处理、动画设计以及AJAX交互等操作,为前端开发者提供了非常方便的编程工具。
本篇文章将为大家简单介绍jQuery的语法和用法,包括选择器、事件、动画和AJAX交互等常用功能。
1. jQuery选择器选择器是jQuery的核心功能之一,它允许我们通过CSS样式来获取文档中的HTML元素。
以下是一些常见选择器:- 元素选择器$('p'):获取所有的p元素$('#header'):获取id为header的元素$('.nav'):获取class为nav的元素jQuery中的事件和原生JavaScript的事件类似,但是它的处理方式更为方便和高效。
以下是一些常用的事件处理方法:- click():点击事件$('button').click(function(){//执行操作});- hover():鼠标悬停事件jQuery提供了一些强大的动画效果,比如淡入淡出、滑动等。
以下是一些常用的动画效果:- fadeIn():淡入效果$('div').fadeIn();- slideUp():上滑效果4. jQuery AJAX交互jQuery AJAX可以实现页面的异步交互,比如发送请求、接收数据等。
以下是一些常用的AJAX方法:- $.ajax():发送和接收请求的函数$.ajax({type: 'post',url: 'test.php',data: {'name': '小明','age': 18},success: function(data){console.log(data);}});总结本文对jQuery的语法和用法进行了简单介绍,包括选择器、事件、动画和AJAX交互等常用功能。
jQuery 简洁教程,jQuery 快速上手教程,jQuery 使用手册,jQuery 常用函数jQuery 语法jQuery 语法是为 HTML 元素的选取编制的,可以对元素执行某些操作。
基础语法是:$(selector).action() 示例 $(this).hide() - 隐藏当前元素 $("p").hide() - 隐藏所有段落 $("p.test").hide() - 隐藏所有 class="test" 的段落 $("#test").hide() - 隐藏所有 id="test" 的元素 提示:jQuery 使用的语法是 XPath 与 CSS 选择器语法的组合。
在本教程接下来的章节,您将学习到 更多有关选择器的语法。
美元符号定义 jQuery 选择符(selector)“查询”和“查找” HTML 元素 jQuery 的 action() 执行对元素的操作文档就绪函数您也许已经注意到在我们的实例中的所有 jQuery 函数位于一个 document ready 函数中:$(document).ready(function(){ --- jQuery functions go here ---});这是为了防止文档在完全加载(就绪)之前运行 jQuery 代码。
jQuery 选择器jQuery 元素选择器jQuery 使用 CSS 选择器来选取 HTML 元素。
$("p") 选取 <p> 元素。
$("p.intro") 选取所有 class="intro" 的 <p> 元素。
$("p#demo") 选取 id="demo" 的第一个 <p> 元素。
变量与函数课件变量与函数课件在计算机科学领域中,变量和函数是两个基本概念,它们在编程语言中起着重要的作用。
变量用于存储数据,而函数则用于执行特定的任务。
本文将探讨变量和函数的概念、用法以及它们在实际编程中的应用。
一、变量的概念与用法变量是计算机程序中存储数据的一种方式。
它们可以存储各种类型的数据,如整数、浮点数、字符串等。
在编程中,我们可以通过给变量赋值来存储数据,并在后续的代码中使用这些数据。
例如,在Python编程语言中,我们可以通过以下方式定义一个整数变量:num = 10在这个例子中,我们定义了一个名为"num"的变量,并将其赋值为10。
现在,我们可以在后续的代码中使用这个变量来进行计算或输出。
除了整数,变量还可以存储其他类型的数据。
例如,我们可以定义一个字符串变量:name = "John"在这个例子中,我们定义了一个名为"name"的变量,并将其赋值为"John"。
现在,我们可以在后续的代码中使用这个变量来进行字符串操作。
变量不仅可以存储数据,还可以进行一些基本的操作,比如加法、减法、乘法和除法。
例如,我们可以定义两个整数变量并进行加法操作:num1 = 5num2 = 3sum = num1 + num2在这个例子中,我们定义了两个整数变量"num1"和"num2",并将它们的和赋值给"sum"变量。
现在,"sum"变量的值为8,我们可以在后续的代码中使用它。
二、函数的概念与用法函数是一段可重用的代码块,用于执行特定的任务。
它们接受输入参数,并返回输出结果。
在编程中,函数可以帮助我们组织代码,并提高代码的重用性和可读性。
在许多编程语言中,函数的定义通常包括函数名、参数列表和函数体。
例如,在Python中,我们可以定义一个简单的函数来计算两个数的和:def add(num1, num2):sum = num1 + num2return sum在这个例子中,我们定义了一个名为"add"的函数,它接受两个参数"num1"和"num2"。
jQuery函数实例分析【函数声明、函数表达式、匿名函数等】⽬录函数声明:函数表达式:匿名函数本⽂实例讲述了jQuery 函数⽤法。
分享给⼤家供⼤家参考,具体如下:命名函数可多次调⽤。
函数声明:function func(args) {//执⾏语句};例:<script>$(document).ready(function() {//创建⼀个点击事件$('img').clikc(show);//show()函数声明function show() {var info = '<div><h3></h3></div>';$(this).after(info);//显⽰⼀次后删除事件$(this).unbind('click');}});</script><body><img src='images/1.png' alt='logo'></body>函数表达式:var func = function(args) {//执⾏语句};例:<script>$(document).ready(function() {//创建函数表达式:showvar show = function() {var info = '<div><h3></h3></div>';$(this).after(info);//显⽰⼀次后删除事件$(this).unbind('click');}$('img').clikc(show);});</script><body><img src='images/1.png' alt='logo'></body>匿名函数以参数,回调或闭包形式出现,不可重复调⽤。
jQuery 选择器参考手册选择器实例选取*$("*") 所有元素#id$("#lastname") id="lastname" 的元素.class$(".intro") 所有class="intro" 的元素element$("p") 所有<p> 元素.class.class$(".intro.demo") 所有class="intro" 且class="demo" 的元素:first$("p:first") 第一个<p> 元素:last$("p:last") 最后一个<p> 元素:even$("tr:even") 所有偶数<tr> 元素:odd$("tr:odd") 所有奇数<tr> 元素:eq(index)$("ul li:eq(3)") 列表中的索引为3的元素索引是从0开始的:gt(no)$("ul li:gt(3)") 列出index 大于3 的元素:lt(no)$("ul li:lt(3)") 列出index 小于3 的元素:not(selector) $("input:not(:empty)") 所有不为空的input 元素:header$(":header") 所有标题元素<h1> - <h6>:animated所有动画元素:contains(text)$(":contains('W3School')") 包含指定字符串的所有元素:empty$(":empty") 无子(元素)节点的所有元素:hidden $("p:hidden") 所有隐藏的<p> 元素:visible$("table:visible") 所有可见的表格s1,s2,s3 $("th,td,.intro") 所有带有匹配选择的元素[attribute]$("[href]") 所有带有href 属性的元素[attribute=value]$("[href='#']") 所有href 属性的值等于"#" 的元素[attribute!=value]$("[href!='#']") 所有href 属性的值不等于"#" 的元素[attribute$=value]$("[href$='.jpg']") 所有href 属性的值包含以".jpg" 结尾的元素:input$(":input") 所有<input> 元素:text$(":text") 所有type="text" 的<input> 元素:password$(":password") 所有type="password" 的<input> 元素:radio$(":radio") 所有type="radio" 的<input> 元素:checkbox$(":checkbox") 所有type="checkbox" 的<input> 元素:submit$(":submit") 所有type="submit" 的<input> 元素:reset$(":reset") 所有type="reset" 的<input> 元素:button$(":button") 所有type="button" 的<input> 元素:image$(":image") 所有type="image" 的<input> 元素:file$(":file") 所有type="file" 的<input> 元素:enabled$(":enabled") 所有激活的input 元素:disabled$(":disabled") 所有禁用的input 元素:selected$(":selected") 所有被选取的input 元素:checked$(":checked") 所有被选中的input 元素jQuery 事件方法方法描述bind()向匹配元素附加一个或更多事件处理器blur()触发、或将函数绑定到指定元素的blur 事件(元素失去焦点)change()触发、或将函数绑定到指定元素的change 事件(元素的值发生改变) click()触发、或将函数绑定到指定元素的click 事件(元素被点击)dblclick()触发、或将函数绑定到指定元素的double click 事件(元素被双击) delegate()向匹配元素的当前或未来的子元素附加一个或多个事件处理器(委托)die()移除所有通过live()函数添加的事件处理程序。
光开放源代码是不够的。
为了让开源进一步开放,在“解码jQuery”系列中,我们会剖析jQuery的每一个方法,领略jQuery框架之美,同时向这个框架背后的天才们致敬。
“OOP与jQuery”是“解码jQuery”系列中的一个子系列,主要讨论jQuery的内部构成及相关的OOP(Object Oriented Programming,面向对象编程)概念。
学习OOP概念的最佳方式,就是剖析一个真实的框架。
学习某个框架的最佳方式,就是领会其中的OOP概念。
jQuery在整合压缩前是分为很多不同文件的。
它的源代码可以在github的这页看到。
jQuery core (在core.js里)是jQuery的核心。
面向对象有5个重要的概念:变量(数据),函数,对象,原型和继承。
这些是JS语言面向对象的基础,也是jQuery的基础。
jQuery核心(core.js)是jQuery的“大脑”,其中涉及五个重要概念:变量(数据)、函数、对象、原型和继承。
这五个方面是jQuery核心的五个“脑叶”,又是探求OOP概念的五个“意识”。
整个jQuery库都浓缩在一个jQuery变量中。
实际上,core.js中有两个jQuery 变量(var jQuery),一个是全局的,另一个是局部的。
今天我们就通过jQuery 来了解JavaScript中的变量和函数这两个概念。
下面就是刚提到的两个jQuery 变量:
// 全局global jQuery
var jQuery = (function() {
// 局部local jQuery
var jQuery = function( selector, context ) {
// ...
}
})();
1.变量保存数据,函数也是数据
我们先来看一看局部的jQuery:
// 局部local jQuery
var jQuery = function( selector, context ) {
//...
}
JavaScript中的函数实际上是数据。
也就是说,通过以下两种方式定义jQuery 函数,结果是相同的:
// 局部local jQuery
function jQuery( selector, context ){
//...
}
// 局部local jQuery
var jQuery = function( selector, context ){
//...
}
2.函数可以匿名
再来看一看全局的jQuery:
// 全局global jQuery
var jQuery = (function() {
//...
})();
从中把函数部分提取出来,就会发现它是匿名的:
function() {
//...
}
在JavaScript中,可以不把数据赋值给变量,而数据照样可以存在。
比如,下面这个字符串可以存在于JavaScript代码中,而且不会返回任何错误:
"我是数据,我不会导致错误。
"
前面第1点提到了“函数是数据”,因此函数也可以独立存在,而不需要被赋值给某个变量。
假如你运行上面的匿名函数,它100%可以运行,而且不会导致任何错误。
那匿名函数有什么用呢?下一点就来回答这个问题。
3.匿名函数可以自调用
匿名函数的一个优点是可以作为自调用的函数来使用。
举个例子,下面的函数在页面加载时会自动执行,你可以在控制台看到输出:
var jQuery = (function() {
console.log("我是自调用。
");
})();
4.
那为什么要像这样来使用匿名函数呢?因为这样可以在不创建全局变量的情况下执行一些内部操作。
jQuery使用匿名自调用函数来完成它的一次性初始化。