首页
学习
活动
专区
工具
TVP
发布
精选内容/技术社群/优惠产品,尽在小程序
立即前往

为什么我们在$(function(){...............})中包含一堆语句; 在jquery

在$(function(){...............})中包含一堆语句是因为在jQuery中,$(function(){...............})是一个闭包,它允许我们将一个函数封装在jQuery对象中,并且在DOM加载完成后执行该函数。

在jQuery中,$(function(){...............})语法可以用于执行一段JavaScript代码,通常用于初始化一些变量或函数,以便在后续的操作中使用它们。例如,我们可以使用以下语法来设置一个页面的背景颜色:

代码语言:javascript
复制
$(function(){
    var pageBackgroundColor = 'white';
})

在上面的代码中,我们使用$(function(){...............})语法将一个变量pageBackgroundColor封装在jQuery对象中,该变量的值设置为'white'。在DOM加载完成后,我们可以使用该变量来设置页面的背景颜色。

因此,在jQuery中,$(function(){...............})语法用于封装和初始化变量或函数,以便在后续的操作中使用它们。

页面内容是否对你有帮助?
有帮助
没帮助

相关·内容

这些优化技巧可以避免我们 JS 过多的使用 IF 语句

作者:Damian Ciplat 译者:前端小智 来源:dev 最近在重构代码时,我发现早期的代码使用太多的 if 语句,其程度是我从未见过的。...这就是为什么我认为分享这些简单的技巧是非常重要的,这些技巧可以帮助我们避免过多的使用 if 语句。...4.非分支策略 此技巧尝试避免使用switch语句,相反是用键/值创建一个映射并使用一个函数访问作为参数传递的键的值。...", })[breed]||'Im the default'; dogSwitch("border xxx") 5.作为数据的函数 我们知道JS函数是第一个类,所以使用它我们可以把代码分割成一个函数对象...OOP多态性最常见的用法是使用父类引用来引用子类对象。

3.3K10
  • 我们为什么MySQL几乎不使用分区表

    Oracle,使用分区表是一种很自然的事情,数据库容量基本都是500G起,大小5T以上都是很常见的。...但是MySQL的使用我们几乎不使用分区表,今天有同学群里一起沟通,我就按照我的理解做了梳理。...我觉得主要是使用模式的差异,我们不使用的主要原因是避免单库存储过大,而且分区表变更相对会比较麻烦,MySQL侧,我们的目标是让数据库更小巧轻量一些,可能更偏TP一些,我们目前是排除了分区表的设计,而且也明确写进了开发规范...这个问题我们调研过,目前来看,查询复杂度的一些变更业务基本都能够接受,而且风险覆盖度要小一些(程序侧也不能完全保证SQL一定好使不走全表扫描)目前我们实现周期表(日表,月表,周表,年表,季表)的日表和月表的自动扩展...此外,数据流转体系,分区表的模式对于数仓体系也不够友好,如果ETL直接抽数据,基本需要在过滤条件的部分做一些取舍,影响还是相对很大的。

    1.6K50

    为什么SQL语句Where 1=1 andSQL Server不影响性能

    因此本文提到Where 1=1 and引起的性能问题就需要按照查询分析器的规则去考虑为什么,这也是Think like query optimizer。    ...Where 1=1 and写法为什么不会变慢?     因为查询分析器代数树优化阶段就把1=1 直接给过滤掉了。这个功能就是查询优化器中所谓的“Constant Folding”。    ...我们这里假设查询分析器代数树优化阶段没有把where 1=1这种情况直接过滤掉。    ...比如语句select * from table where a=1 and b=2 这个语句,SQL Server估计的行数会是:     a列的选择率*b列的选择率*表采样的总行数     因此,当...这里我们举例,假如表中有100万行数据,where a=1的数据有1万条,where b=1的数据有1万条,则A和B的选择性都是1/100=0.01,WhereA And B联合的估计行数则变为0.01

    2K30

    行为型模式之策略模式

    前言 讲解策略模式之前,我们了解下行为型设计模式。那么行为型是什么意思呢?主要场景是什么呢?...如果我另外的位置需要还需要写这么一堆switch语句。...追本溯源,我们定位到jq的源码: // line 660-667 https://github.com/jquery/jquery/blob/2.0.0/src/effects.js jQuery.easing...- Math.cos( p*Math.PI ) / 2; } }; 表单验证 除了上面的,其实我们工作复杂常用的表单验证也可以用这个设计模式轻松实现,甚至我们还可以根据自己的需要去为其增加策略...将算法单独维护策略对象里,负责算法的人不用关心具体业务使用;而业务方只要负责调用即可; 通过对算法的封装实现了对算法的引用,避免了重复; 策略模式也是分支语句的一种优化技巧,目的也是为了让其更加可维护

    32030

    【经验】编写优秀jQuery插件的10个技巧

    使用返回一个元素 JavaScript/jQuery有一个很好的特点就是可以进行方法级联,所以我们不应该破坏这个特性,始终方法返回一个元素。我我的每一个jQuery插件中都遵守这一条。...”是完全插件方法外面的,由于这些代码是闭包里面,我们不用担心这些变量被重写。...首先我们需要创建我们最初的类定义,多数情况下这就意味着创建一个对象。这个定义包含了每一个对象实例都不同的部分。...我的Paint jQuery Plugin 插件,我是这么写的: function Canvas(settings) {this.settings = settings;this.draw = false...每一个对象中保存设置 我一直每一个对象中保存自己的设置,然后操作它自己的设置。这样你就不用在不同的方法传递很多参数。把这些变量放在对象,也方便你在其他地方调用这些变量。

    56920

    jQuery使用经验建议

    使用返回一个元素 JavaScript/jQuery有一个很好的特点就是可以进行方法级联,所以我们不应该破坏这个特性,始终方法返回一个元素。我我的每一个jQuery插件中都遵守这一条。...我们将会在后面讨论prototype的时候,看这个方法实际的运用。...首先我们需要创建我们最初的类定义,多数情况下这就意味着创建一个对象。这个定义包含了每一个对象实例都不同的部分。...我的 Paint jQuery Plugin 插件,我是这么写的: /* 何问起 hovertree.com */ function Canvas(settings) { this.settings...每一个对象中保存设置 我一直每一个对象中保存自己的设置,然后操作它自己的设置。这样你就不用在不同的方法传递很多参数。把这些变量放在对象,也方便你在其他地方调用这些变量。

    1.1K40

    基于vue.js的渐进式组件尝试

    我们有个内部运营系统,是基于keenthemes的一个主题进行开发的,而这个主题就是基于jQuery+bootstrap+jQueryPlugins 进行的定制主题,用于显示各种图表和曲线。...不过说实话,要是一个项目从头开始折腾,还是可以考虑的,但是一想到又要用npm安装一堆依赖,也是头大。 我需要的方案是,已有的项目上,门槛低点,依赖很少的东西,还能包容已有的开发模式。...比如说,我就把一堆标签用一个新的标签替代,然后解析页面的执行js脚本还原回来,这是最基本的一步。 我有限的认知里,vue.js就是最简单的满足需求的选择。为什么不用react?...当然就是包含datepicker标签的元素需要加载到一个Vue实例。 然后,再加强对这个标签的控制,比如说传入值,获取值以及对于datepicker事件的处理等,使得它功能更加完整。...事实上,我们还希望能够只要引用这个组件,依赖也要自然地满足。而这个,无非就是合适的时候把依赖的css和js动态加载进来。这个“合适的时候”我仍然选择的是"mounted"阶段,为什么

    1.4K10

    基于vue.js的渐进式组件尝试

    我们有个内部运营系统,是基于keenthemes的一个主题进行开发的,而这个主题就是基于jQuery+bootstrap+jQueryPlugins 进行的定制主题,用于显示各种图表和曲线。...不过说实话,要是一个项目从头开始折腾,还是可以考虑的,但是一想到又要用npm安装一堆依赖,也是头大。 我需要的方案是,已有的项目上,门槛低点,依赖很少的东西,还能包容已有的开发模式。...比如说,我就把一堆标签用一个新的标签替代,然后解析页面的执行js脚本还原回来,这是最基本的一步。 我有限的认知里,vue.js就是最简单的满足需求的选择。为什么不用react?...当然就是包含datepicker标签的元素需要加载到一个Vue实例。 然后,再加强对这个标签的控制,比如说传入值,获取值以及对于datepicker事件的处理等,使得它功能更加完整。...事实上,我们还希望能够只要引用这个组件,依赖也要自然地满足。而这个,无非就是合适的时候把依赖的css和js动态加载进来。这个“合适的时候”我仍然选择的是"mounted"阶段,为什么

    1.8K100

    前端渲染引擎doT.js解析

    早期版本的doT.js,处理条件表达式的方式和tmpl一样,采用直接替换成可执行语句的形式,最新版本的doT.js,修改成仅一条正则就可以实现替换,变得更加简洁。...具体关于new Fcuntion的定义和用法,详细请阅读Function详细介绍。 性能之因 读到这里可能会产生一个疑问:doT.js的性能为什么众多引擎如此突出?...');}return __;" ); } 在上面的代码中看到,jQuery-teml同样使用了new Function()的方式编译模板,但是性能对比jQuery-teml性能相比...with语句为什么对性能有这么大的影响?...首先来我们做第一次性能提升,移除源码with语句。 第一次提升后: ? 接下来第二部提升,落实Boris Moore设计理念的模板缓存: ?

    3K40

    你没有抓住 Promises 的要点

    将要到来的 ECMAScript 6 的版本,使用了一些内部技巧,大多数情况下代码还是一样的。...; } 如果 API 的使用者坚持使用 JQuery promises 的话,你大概只有两种选择:执行过程莫名其妙地、令人困惑地失败,或者彻底失败,并且阻塞你继续使用整个类库。这可真糟糕啊。...继续向前 这就是我为什么尽可能地避免 Ember 中使用回调函数聚合器了,这也是我写这篇文章的原因,而且,你可以看一下我写的这个准确兼容 Promises/A 规范的套件,这样我们就可以认识层面上达成一致了...值得注意的是,写这篇文章的时候,JQuery 的最新版本是 1.9.1,它的 promises 错误处理上的实现是完全错误的。...我希望接下去的 JQuery 2.0 版本参考 Promises/A+的文档,修正这个问题。

    61810

    从零开始学 Web 之 jQuery(一)jQuery的概念,页面加载事件

    里面封装了一大堆的方法方便我们的开发,其实就是一个加强版的 common.js。因此我们学习jQuery,其实就是学习jQuery这个 js 文件中封装的一大堆方法。 4、jQuery 能做什么?...jQuery 本身就是一堆 JavaScript 函数,JavaScript 是做什么的,jQuery 就是做什么的。...毕竟 jQuery 知识 JavaScript 编写的函数库而已,有些功能 jQuery 没有封装,则还需要通过自己写原生 JavaScript 来实现。 5、为什么要学 jQuery?...DOM对象转jQuery对象:$(DOM对象) jQuery对象转DOM对象:jQuery对象[0] 为什么 DOM 和 jQuery 要互转,最开始就用 jQuery不好吗?...2、jQuery页面加载事件 2.1、方式一:DOM转jQuery方式 $(window).load(function () { console.log("load:1"); }); $(window

    1.6K40

    js写插件教程

    ,jQuery的映射;方便内部直接调用; //当然你不引用jq的话头部的$和底部的jQuery干掉;你若引用了更过的依赖可以依次添加; //最后面的undefined可不写;最好写了;保证里面再出现的...,document,jQuery) 或者写在一个闭包里(function(){           }()) */ (function(win,doc,undefined){...//我们随便写一个插件吧 比如你要点击按钮 添加input的值到 div里 var addHtml = function(demo,btn){//插件名,调用的时候直接new一下插件名就行了并传参数或者传对象...this的指向为调用的实例;我们此时姑且认为this就指向这个函数;因为这样我们之后再想获取这个div就可以直接用this.div了好吗;而不是document.getElementById(。。。。...= doc.getElementById(btn); this.Input = this.div.getElementsByTagName("input")[0];//既然找到了div我们找下

    35.1K10

    01-老马jQuery教程-jQuery入口函数及选择器

    1.什么是jQuery? 1.1 jQuery介绍 jQuery是一个轻型、快速的、小巧的功能丰富的JavaScript类库。本质就是一堆js的函数的组合。...1.2 为什么要学习jQuery 虽然前端的MVVM开发模式已经进入各个公司和各个开发人员的视野,而且也异常火爆。为什么还要学习jQuery呢?...install jquery 2.入口函数介绍 2.1window.onload事件的问题 之前DOM课 咱们已经说过用window的onload事件作为JS代码的入口,时机并不好。...因为window.onload事件是页面的图片、第三方脚本、样式等都下载和加载完成后才会触发。而我们希望是页面的HTML的文档树对象可进行交互就立即绑定DOM的事件和做一些初始化工作。...$("p[attr$=a_value_end]") 选取所有p标签且attr属性的属性值是以a_value_end结尾的 $("p[attr*=a_value") 选取所有p标签且attr属性的属性值包含

    2.5K100

    十三、jQuery过时的今天,你还会使用它吗

    jQuery在前端史上有它非常超然的历史地位,许多从中学到的技巧实践开发仍然非常好用。简单的了解它有助于我们更加深入的理解JavaScript。...: jQuery, version: '1.0.0', init: function (selector) { // jquery这里有一个复杂的判断,但是这里我做了简化...this; }, // 原型上添加一堆方法 toArray: function () { }, get: function () { }, each: function...也就是说,当我们通过jQuery.extend扩展jQuery时,方法被添加到了jQuery构造函数,而当我们通过jQuery.fn.extend扩展jQuery时,方法被添加到了jQuery原型。...实现jQuery扩展方法时,一部分方法需要扩展到构造函数,一部分方法需要扩展到原型,当我们通读jQuery源码时,还发现有一些方法放在了模块作用域中,至于为什么会有这样的区别,建议大家回过头去读读前一篇文章

    1.4K20

    js什么是匿名函数_js函数返回值

    为什么只有一个匿名函数又没看到运行(当然是运行了…… ),就能有jQuery 这么个函数库了?于是,我抱着疑问来到CSDN 。结果相信现在很多人都很清楚了(因为我之 后也不乏来者,呵呵~ )。...但是,计算机编程语言中,函数的定义也八九不离十。因为,我们都知道,计算机的函数,也类似数学定义的描述,它是将输入的若干数据,经过代码设定的逻辑操作处理后,返回唯一的输出的一组代码组合块。...下面,我们先初步了解一下和匿名函数相关的概念。 函数声明(function 语句),要使用一个函数,我们就得首先声明它的存在。...对匿名函数的调用其实还有一种做法,也就是我们看到的jQuery 片段—— 使用() 将匿名函数括起来,然后后面再加一对小括号(包含参数列表)。...让我们换个更加简单的方法说明:闭包,其实是一种语言特性,它是指的是程序设计语言中,允许将函数看作对象,然后能像在对象的操作般函数定义实例(局部)变量,而这些变量能在函数中保存到函数的实例对象销毁为止

    7.1K20

    01-老马jQuery教程-jQuery入口函数及选择器

    1.1 jQuery介绍 jQuery是一个轻型、快速的、小巧的功能丰富的JavaScript类库。本质就是一堆js的函数的组合。...1.2 为什么要学习jQuery 虽然前端的MVVM开发模式已经进入各个公司和各个开发人员的视野,而且也异常火爆。为什么还要学习jQuery呢?...因为window.onload事件是页面的图片、第三方脚本、样式等都下载和加载完成后才会触发。而我们希望是页面的HTML的文档树对象可进行交互就立即绑定DOM的事件和做一些初始化工作。...3.3 jQuery的包装对象和DOM对象 通过jQuery的选择器选择出来的对象都是jQuery的包装对象,里面封装了jQuery的很多API方法,后续我们会一一学习。...$("p[attr$=a_value_end]") 选取所有p标签且attr属性的属性值是以a_value_end结尾的 $("p[attr*=a_value") 选取所有p标签且attr属性的属性值包含

    2.4K00

    js的匿名函数 转

    为什么只有一个匿 名函数又没看到运行(当然是运行了……),就能有jQuery这么个函数库了?于是,我抱着疑问来到CSDN。结果相信现在很多人都很清楚了(因为我之 后也不乏来者,呵呵~)。...但是,计算机编程语言中,函数的定义也八九不离十。因为,我们都知道,计算机的函数,也类似数学定义的描述,它是将输入的若干数据,经过代码设定的逻辑操作处理后,返回唯一的输出的一组代码组合块。...下面,我们先初步了解一下和匿名函数相关的概念。  函数声明(function 语句)    要使用一个函数,我们就得首先声明它的存在。...对匿名函数的调用其实还有一种做法,也就是我们看到的jQuery片段——使用()将匿名函数括起来,然后后面再加一对小括号(包含参数列表)。...让我们换个更加简单的方法说明:闭包,其实是一种语言特性,它是指的是程序设计语言中,允许将函数看作对象,然后能像在对象的操作搬函数定义实例(局部)变量,而这些变量能在函数中保存到函数的实例对象销毁为止

    3.8K20

    解决ASP.NET的各种乱码问题

    (responseText);                 }   }) ==>JavaScript中正确的URL编码方式 看过前面的示例,您有没有想过:为什么escape不能解决的问题,JQuery...对于这个问题,我想还是先来看看MSDN关于escape的说明: escape方法不能用来对唯一资源标示符(URL)进行编码,请使用encodeURI和encodeURIComponent方法 从JQuery...它通常用于编码URL路径包含有类似汉字这种场合,不适合处理URL参数。 但是,URL路径的目录名与文件名,我们可以选择英文字符,所以encodeURI通常没有机会使用。...虽然System.Uri的那二个编码方法,也能实现我们需要的URL编码任务, 但是,当ASP.NET填充Request.QueryString, Request.Form时,使用的解码方法是HttpUtility.UrlDecode...这一堆解释啊 结论: 一个完整的URL可以简单地认为包含二个部分:文件路径(含目录) 和 查询参数(QueryString) 在编码时,一定要分开处理。

    1.9K90

    typescript声明文件:全局变量模块拆分自动生成声明文件

    什么是声明文件通常我们会把声明语句放到一个单独的文件(jQuery.d.ts),这就是声明文件3:// src/jQuery.d.tsdeclare var jQuery: (selector: string...的 files、include 和 exclude 配置,确保其包含jQuery.d.ts 文件。...需要注意的是,声明语句中只能定义类型,切勿声明语句中定义具体的实现5:declare const jQuery = function(selector) {    return document.querySelector...// src/index.tsjQuery('#foo');函数类型的声明语句中,函数重载也是支持的6:// src/jQuery.d.tsdeclare function jQuery(selector...namespace 被淘汰了,但是声明文件,declare namespace 还是比较常用的,它用来表示全局变量是一个对象,包含很多子属性。

    3.3K11
    领券