JQuery核心函数：

（1）. jQuery([selector,[context]])

用法；这个函数最基本的用法就是向它传递一个表达式（通常由 CSS 选择器查找所有匹配的元素）。

这个函数接收一个包含 CSS 选择器的字符串，然后用这个字符串去匹配一组元素。

函数的基本功能： jquery的核心功能都是通过它来实现，jQuery中的一切都基于这个函数，或者说都是在以某种方式使用这个函数。

默认情况下, 如果没有指定context参数，$()将在当前的 HTML document中查找 DOM 元素；如果指定了 context 参数，如一个 DOM 元素集或 jQuery 对象，那就会在这个 context 中查找。在jQuery 1.3.2以后，其返回的元素顺序等同于在context中出现的先后顺序。

其参数有：

Selector: 用来查找的字符串。

Context：作为待查找的DOM元素集，文档或jquery对象。

Element: 一个用于封装成jQuery对象的DOM元素。

Object: 一个用于封装成jQuery对象

elementArray: 一个用于封装成jQuery对象的DOM元素数组。

jQuery object:一个用于克隆的jQuery对象

jQuery()：返回一个空的jQuery对象

（2）.jQuery(html,[ownerDocument])

用法：根据提供的原始 HTML 标记字符串，动态创建由 jQuery 对象包装的 DOM 元素。同时设置一系列的属性、事件等。

你可以传递一个手写的 HTML 字符串，或者由某些模板引擎或插件创建的字符串，也可以是通过 AJAX 加载过来的字符串。但是在你创建 input 元素的时会有限制，当然这个字符串可以包含斜杠 (比如一个图像地址)，还有反斜杠。当你创建单个元素时，请使用闭合标签或 XHTML 格式。例如，创建一个 span ，可以用$("<span/>") 或 $("<span></span>") ，但不推荐 $("<span>")。在jQuery 中，这个语法等同于$(document.createElement("span")) 。

在jQuery 1.8中，通过$(html,props)，您可以使用任何jQuery对象的方法或插件。在此之前，你只能使用一个方法名的短名单，并有没有成文的方式添加到列表中。

之前，你只能使用一个方法名的短名单，并有没有成文的方式添加到列表中。

注意：这可能会导致你的代码的行为改变，如果插件添加后，有相同的名称作为HTML属性。

其参数有：

@Html.[ownerDosument]:

html:用于动态创建DOM元素的HTML标记字符串

ownerDocument:创建DOM元素所在的文档参数有：

@html.props:

html:用于动态创建DOM元素的HTML标记字符串

props:用于附加到新创建元素上的属性、事件和方法

(3)jQuery(callback): $(document).ready()的简写。

用法：可以绑定一个在DOM文档载入完成后执行的函数。这个函数的作用如同$(document).ready()一样，只不过用这个函数时，需要把页面中所有需要在 DOM 加载完成时执行的$()操作符都包装到其中来。

从技术上来说，这个函数是可链接的：但真正以这种方式链接的情况并不多。

可以在一个页面中使用任意多个$(document).ready事件。

注意：可以参考 ready(Function) 获取更多 ready 事件的信息。

其参数有：

Callback:当DOM加载完成后要执行的函数

文档处理的相关方法总结：

（1）主要类型分为：内部插入，外部插入，包裹，替换，删除，复制。

（2）内部插入：

@append(content|fn):

用法：向每个匹配的元素内部追加内容。

注意：这个操作与对指定的元素执行appendChild方法，将它们添加到文档中的情况类似

其参数有：

Content:要追加到目标中的内容

function(index, html): 返回一个HTML字符串，用于追加到每一个匹配元素的里边。接受两个参数，index参数为对象在这个集合中的索引值，html参数为这个对象原先的html值

@appendTo(content):

用法：把所有匹配的元素追加到另一个指定的元素元素集合中。实际上，使用这个方法是颠倒了常规的$(A).append(B)的操作，即不是把B追加到A中，而是把A追加到B中，而content是用于被追加的内容。

@prepend(content)：

用法：向每个匹配的元素内部前置内容。

这是向所有匹配元素内部的开始处插入内容的最佳方式。

（3）外部插入：

@after(content|fn)：

用法：在每个匹配的元素之后插入内容

@before(content|fn)：

用法：在每个匹配的元素之前插入内容

@insertAfter(content):

用法：把所有匹配的元素插入到另一个、指定的元素元素集合的后面。

实际上，使用这个方法是颠倒了常规的$(A).after(B)的操作，即不是把B插入到A后面，而是把A插入到B后面。

@insertBefore(content):

用法：把所有匹配的元素插入到另一个、指定的元素元素集合的前面。实际上，使用这个方法是颠倒了常规的$(A).before(B)的操作，即不是把B插入到A前面，而是把A插入到B前面

（4）包裹：

@wrap(html|element|fn):

用法：把所有匹配的元素用其他元素的结构化标记包裹起来。

注意：这种包装对于在文档中插入额外的结构化标记最有用，而且它不会破坏原始文档的语义品质。这个函数的原理是检查提供的第一个元素（它是由所提供的HTML标记代码动态生成的），并在它的代码结构中找到最上层的祖先元素－－这个祖先元素就是包裹元素。当HTML标记代码中的元素包含文本时无法使用这个函数。因此，如果要添加文本应该在包裹完成之后再行添加。

@unwrap():

用法：这个方法将移出元素的父元素。这能快速取消 .wrap()方法的效果。匹配的元素（以及他们的同辈元素）会在DOM结构上替换他们的父元素。

@wrapAll(html|ele):

用法：将所有匹配的元素用单个元素包裹起来

@wrapInner(htm|element|fnl):

用法:将每一个匹配的元素的子内容(包括文本节点)用一个HTML结构包裹起来

(5)替换：

@replaceWith(content|fn):

用法：将所有匹配的元素替换成指定的HTML或DOM元素

@replaceAll(selector):

用法：用匹配的元素替换掉所有 selector匹配到的元素。

(6)删除：

@empty():

用法：删除匹配的元素集合中所有的子节点。

@remove([expr]):

用法：从DOM中删除所有匹配的元素。

@detach([expr]):

用法：从DOM中删除所有匹配的元素

（7）复制：

@clone([Even[,deepEven]])：

用法：克隆匹配的DOM元素并且选中这些克隆的副本。在想把DOM文档中元素的副本添加到其他位置时这个函数非常有用。

3.运用JQuery写的计算器小案例：

先进行页面布局。
parseFloat()函数:是全局函数，不属于任何对象，可解析一个字符串，并返回一个浮点数。

该函数指定字符串中的首个字符是否是数字。如果是，则对字符串进行解析，直到到达数字的末端为止，然后以数字返回该数字，而不是作为字符串。

用法：

将它的字符串参数解析成为浮点数并返回。如果在解析过程中遇到了正负号（+ 或 -）、数字 (0-9)、小数点，或者科学记数法中的指数（e 或 E）以外的字符，则它会忽略该字符以及之后的所有字符，返回当前已经解析到的浮点数。同时参数字符串首位的空白符会被忽略。如果参数字符串的第一个字符不能被解析成为数字，则 parseFloat 返回 NaN。

注意：可以通过调用 isNaN 函数来判断 parseFloat 的返回结果是否是 NaN。如果让 NaN 作为了任意数学运算的操作数，则运算结果必定也是 NaN。

（3）option:

value 属性规定在表单被提交时被发送到服务器的值。<option> 与 <option/> 之间的值是浏览器显示在下拉列表中的内容，而 value 属性中的值是表单被提交时被发送到服务器的值。

注意：如果没有指定 value 属性，选项的值将设置为 <option> 标签中的内容。

（4）先将num1,num2的值转为浮点数，获取值，如果运算符为 + ，- ，* ，/中的某一项，则进行相关的运算操作，从而输出正确值。

运用JQuery代码写的计算器小案例相关推荐

vue简易计算器小案例09
简易计算器小案例逻辑部分没有完全实现,主要用来练手,加强理解父子组件之间的通信过程. 效果: 简易计算器代码 counter.html <!DOCTYPE html> <html ...
JQuery的几个简单小案例（基础）
JQuery的几个简单小案例实现表格的的隔行换色实现复选框的全选与全不选 QQ表情的选择多选下拉列表的左右移动实现表格的的隔行换色需求:事先制作一个如图所示的table表格,将数据行的奇数行 ...
jQuery插件实现图片墙小案例
你想写出绚丽多彩的图片墙吗?想的话就来一起看一下接下来的内容吧接下来就让我们使用两个简单的插件来实现图片墙小案例吧.编写之前需要提前下载lazyload懒加载插件和masonry瀑布流式布局插件.( ...
50行Jquery代码写轮播图
css源文件 #slideshow {width: 1226px;height: 460px;overflow: hidden;position: relative;margin: 50px auto ...
python text insert()背景色_50行python代码写个计算器教程
案例展示计算器.gif 你能学到 input 用户输入 print输出 tkinter图形界面 python运算符号基础知识准备运算符号数字运算,求和我们使用了加号 (+)运算符,除此外,还有 ...
女友晚安之后依然在线：python男友用20行代码写了个小工具
大家好,我是Lex 喜欢欺负超人那个Lex 擅长领域:python开发.网络安全渗透.Windows域控Exchange架构今日重点:python用20代码实现录屏功能代码干货满满,建议收藏+实操 ...
python新手入门代码-介绍十个Python小案例，新手入门就在这里
案例一:排列组合要求: 将4个数字可能组成的所有互不相同且无重复数字的排列组合列出. 注意:很多人学Python过程中会遇到各种烦恼问题,没有人帮答疑容易放弃.为此小编建了个Python全栈免费答疑 ...
用300行代码写一个童年小游戏，俄罗斯方块
这几天在外面吃饭总听见,别人那说撸几把什么的.让我想起小时候玩过的游戏俄罗斯方块- 不要说我脑回路不正常,虽然没有现在这些游戏的精美画面,但是充满着满满的回忆在里面,那么用 JAVA 如何写俄罗斯方块 ...
python编程小案例_用Python3编程写第一个小案例！-Go语言中文社区
用Python3编程第一步! 今天博主跟大家聊一聊如何使用Python3编程第一步!!不喜勿喷,如有建议欢迎补充.讨论! Come on! 在前面的几篇文章中我们已经学习了一些Python3 的基本语 ...

运用JQuery代码写的计算器小案例

其参数有：

Selector: 用来查找的字符串。

Context：作为待查找的DOM元素集，文档或jquery对象。

Element: 一个用于封装成jQuery对象的DOM元素。

Object: 一个用于封装成jQuery对象

elementArray: 一个用于封装成jQuery对象的DOM元素数组。

jQuery object:一个用于克隆的jQuery对象

jQuery()：返回一个空的jQuery对象

（2）.jQuery(html,[ownerDocument])

用法：根据提供的原始 HTML 标记字符串，动态创建由 jQuery 对象包装的 DOM 元素。同时设置一系列的属性、事件等。

在jQuery 1.8中，通过$(html,props)， 您可以使用任何jQuery对象的方法或插件。在此之前，你只能使用一个方法名的短名单，并有没有成文的方式添加到列表中。

之前，你只能使用一个方法名的短名单，并有没有成文的方式添加到列表中。

注意：这可能会导致你的代码的行为改变，如果插件添加后，有相同的名称作为HTML属性。

其参数有：

@Html.[ownerDosument]:

html:用于动态创建DOM元素的HTML标记字符串

ownerDocument:创建DOM元素所在的文档参数有：

@html.props:

html:用于动态创建DOM元素的HTML标记字符串

props:用于附加到新创建元素上的属性、事件和方法

(3)jQuery(callback): $(document).ready()的简写。

用法：可以绑定一个在DOM文档载入完成后执行的函数。这个函数的作用如同$(document).ready()一样，只不过用这个函数时，需要把页面中所有需要在 DOM 加载完成时执行的$()操作符都包装到其中来。

从技术上来说，这个函数是可链接的：但真正以这种方式链接的情况并不多。

可以在一个页面中使用任意多个$(document).ready事件。

注意：可以参考 ready(Function) 获取更多 ready 事件的信息。

其参数有：

Callback:当DOM加载完成后要执行的函数

（1）主要类型分为：内部插入，外部插入，包裹，替换，删除，复制。

（2）内部插入：

@append(content|fn):

用法：向每个匹配的元素内部追加内容。

注意：这个操作与对指定的元素执行appendChild方法，将它们添加到文档中的情况类似

其参数有：

Content:要追加到目标中的内容

function(index, html): 返回一个HTML字符串，用于追加到每一个匹配元素的里边。接受两个参数，index参数为对象在这个集合中的索引值，html参数为这个对象原先的html值

@appendTo(content):

用法：把所有匹配的元素追加到另一个指定的元素元素集合中。实际上，使用这个方法是颠倒了常规的$(A).append(B)的操作，即不是把B追加到A中，而是把A追加到B中，而content是用于被追加的内容。

@prepend(content)：

用法：向每个匹配的元素内部前置内容。

这是向所有匹配元素内部的开始处插入内容的最佳方式。

（3）外部插入：

@after(content|fn)：

用法：在每个匹配的元素之后插入内容

@before(content|fn)：

用法：在每个匹配的元素之前插入内容

@insertAfter(content):

用法：把所有匹配的元素插入到另一个、指定的元素元素集合的后面。

实际上，使用这个方法是颠倒了常规的$(A).after(B)的操作，即不是把B插入到A后面，而是把A插入到B后面。

@insertBefore(content):

用法：把所有匹配的元素插入到另一个、指定的元素元素集合的前面。实际上，使用这个方法是颠倒了常规的$(A).before(B)的操作，即不是把B插入到A前面，而是把A插入到B前面

（4）包裹：

@wrap(html|element|fn):

用法：把所有匹配的元素用其他元素的结构化标记包裹起来。

@unwrap():

用法：这个方法将移出元素的父元素。这能快速取消 .wrap()方法的效果。匹配的元素（以及他们的同辈元素）会在DOM结构上替换他们的父元素。

@wrapAll(html|ele):

用法：将所有匹配的元素用单个元素包裹起来

@wrapInner(htm|element|fnl):

用法:将每一个匹配的元素的子内容(包括文本节点)用一个HTML结构包裹起来

(5)替换：

@replaceWith(content|fn):

用法：将所有匹配的元素替换成指定的HTML或DOM元素

@replaceAll(selector):

@replaceAll(selector):

用法：用匹配的元素替换掉所有 selector匹配到的元素。

(6)删除：

@empty():

用法：删除匹配的元素集合中所有的子节点。

@remove([expr]):

用法：从DOM中删除所有匹配的元素。

@detach([expr]):

用法：从DOM中删除所有匹配的元素

（7）复制：

@clone([Even[,deepEven]])：

用法：克隆匹配的DOM元素并且选中这些克隆的副本。在想把DOM文档中元素的副本添加到其他位置时这个函数非常有用。

3.运用JQuery写的计算器小案例：

运用JQuery代码写的计算器小案例相关推荐

最新文章

热门文章

在jQuery 1.8中，通过$(html,props)，您可以使用任何jQuery对象的方法或插件。在此之前，你只能使用一个方法名的短名单，并有没有成文的方式添加到列表中。