分组操作符(),括号内只能包含表达式
1 | var num = (1,323,5,6) //num等于最后一个数; |
1 | (function f(){})() |
//再看一个
1 | try { |
4、使用花括号({})来定义对象字面量,JSON数据格式,代码块。
1 | var num = (1,323,5,6) //num等于最后一个数; |
1 | (function f(){})() |
//再看一个
1 | try { |
4、使用花括号({})来定义对象字面量,JSON数据格式,代码块。
定义:确保一个类仅有一个实例,并提供一个访问它的全局访问点。
1 | // 定义一个类 |
我们也可以使用闭包来实现:
1 | function Singleton(name) { |
1 | // 单例构造函数 |
对于在js中来判断checkbox是否被选中很简单,举个例子来说
HTML代码:
1 | <input type="checkbox" name="box"> |
相应的javascript代码如下:
1 | var check = document.getElementsByTagName('input')[0]; |
因为HTML代码中没有设置checked属性值,所以默认返回false,反之则返回true;若要在HTML中设置checkbox为选中状态则可以这样设置:
1 | <input type="checkbox" name="box" checked="true"> |
(1)、JQ1.6版本之前(不包括1.6版本)判断checkbox是否被选中用的是attr()方法,HTML代码与上面相同,只放JQ代码:
1 | console.log($("input[type='checkbox']").attr('checked'));//false |
不要想着在JQ1.6版本之前使用prop()方法,只会报出$().prop()is not a function的错误
(2)、JQ1.6版本之后Jquery中新引入了prop()方法,此时再用attr()方法判断checkbox的状态则会返回undefined,若有设置checked属性为true,则会返回checked而不是true
1.6+版本prop()方法:
1 | console.log($("input[type='checkbox']").prop('checked'));//false |
(3)、除了以上两种方法JQ中还有一个is()方法同样可以判断checkbox的状态
is()方法代码如下:
1 | console.log($("input[type='checkbox']").is(':checked'));//false |
要特别注意不要漏巧”:disabled”中的”:”
1 | overflow: hidden; |
本教程使用Docker在服务器中运行Jenkins并实现从Github版本库的自动化部署,使得代码更新到Github版本库之后能够自动构建并发送到网站部署服务器。
在部署之前你需要做以下准备:
*关于Docker和Nginx的安装和使用,可以参照另一篇教程:http://note.youdao.com/noteshare?id=f32aee796b06882786e1149d2043da17
该部分需要有基础的Git知识
登录到Github账户,新建一个repository,建议选择建立一个README文件。
填写完README文件后,点击Clone or download,将里面的HTTP链接复制下来保存好
在本地的计算机选择一个文件夹,使用相关的Git工具将新建的版本库克隆下来(应该只有一个README文件),url就是刚刚保存的链接。
将你的代码全部放进这个文件夹里,然后将更改commit并push到Github版本库。
这样你就有一个Github的版本库保存你的代码了。
拥有版本库之后,我们还需要设定一个钩子,这样每次更新代码后,就会自动触发Jenkins的工作。
在Github版本库的Settings中,点击Webhooks,然后点击Add Webhook添加一个钩子。
URL填写你准备部署Jenkins的服务器地址,格式为
1 |
|
docker run \
-u root \
–rm \
-d \
-p 8080:8080 \
-p 50000:50000 \
-v /root/jenkins-data:/var/jenkins_home \
-v /var/run/docker.sock:/var/run/docker.sock \
-v “$HOME”:/home \
–name jenkins \
jenkinsci/blueocean
1 |
|
pipeline {
agent none
stages {
stage(‘build’) {
agent {
docker {
image ‘node:9-alpine’
args ‘-p 3000:3000’
}
}
steps {
sh ‘npm config set sass_binary_site https://npm.taobao.org/mirrors/node-sass/'
sh ‘npm install –registry=https://registry.npm.taobao.org'
sh ‘npm run build’
}
}
stage(‘copy’) {
agent any
steps {
sh ‘scp -r /var/jenkins_home/workspace/demo/dist root@$ipaddress:/path-to-html-file/‘
}
}
}
}`
需要针对具体情况对路径、IP地址等作出改动。
下面解释该段代码含义:
agent
表示下面部分的代码将在特定的环境下运行,每个流水线中agent都是必须存在的,其中none
在最外边,使得里面的每个stage
可以设置不同的环境,any
表示不对环境做具体要求stage
表示不同的步骤,可以通过agent
设置在不同的环境中运行docker
表示使用特定的Docker镜像,其中image
表示镜像名称,args
表示运行镜像的参数steps
表示按顺序执行一系列的指令sh
表示执行Linux系统的脚本指令scp
是基于SSH的远程文件传输指令,记得将IP地址填入整段代码分为两个部分。第一部分在node镜像中执行,将源代码构建成网页代码。第二部分则将生成出来的网页代码发送到远程的网站部署服务器的指定路径当中。
关于更加详细的流水线语法,可以参考Jenkins的官方文档
将文件保存为Jenkinsfile(不要加任何的后缀名),并存放在代码库的根目录下。
将改动commit并push到Github上,然后会触发钩子自动将代码构建并将生成的代码自动发送到网站部署服务器。
若在网站服务器上正确安装和部署Docker和Nginx,并正确将外部文件挂载至容器内(包含发送生成代码的路径),在浏览器上访问网站服务器就能够看到之前做的改动啦!
这样以后只要将新代码推送到版本库,就可以在网站服务器看到改动的成果了。
1、把jQuery修改成SeaJs的模块代码非常简单,就是用下面这段语句将jQuery源代码包裹起来:
1 | define('jquery',[],function(require, exports, module){ |
2、也可以加一个判断,如果define已经被定义,就把jQuery模块化,如果define没有被定义,正常执行jQuery代码:
1 | (function(factory) { |
3、如果你用的是jQuery1.7版本以上的,那就更方便了。可以看下jQuery源码的最后几行,你会发现类似下方的代码:
1 | if ( typeof define === "function" && define.amd && define.amd.jQuery ) { |
4、如果判断语句为真,那么jQuery就会自动模块化。所以改下判断语句,只留typeof define === “function”,jQuery便可以自动模块化:
1 | if ( typeof define === "function") { |
模块化后的调用代码如下:
1 | seajs.config({ |
模块化jQuery插件
1、普通插件
1 | (function($){ |
一般模块化代码像下面这样:
1 | /*jquerySayHello.js*/ |
使用插件的代码如下:
1 | seajs.config({ |
注意我在插件构造函数里面写的console.log(‘init’);这段代码,可以看到,如果我请求两次插件,插件就要初始化两次。这个虽然可以让代码只在使用时才执行,减少了资源消耗,但如果一个页面中多处需要这个插件的话,就要执行很多次。如果改成下面这种,直接在本模块里就执行:
使用插件的代码如下:
1 | (function (factory) { |
使用插件的代码如下
1 | seajs.config({ |
link
attr是通过setAtrribute和getAttribute来设置的,使用的是DOM属性节点,而prop是通过document.getElementById(el)[name] = value来设置的,是转化为js对象的属性。
通常在获取或者设置checked,selected,readonly,disabled等的时候使用prop效果更好,减少了访问dom属性节点的频率。
大家知道,有的浏览器只要写checked,disabled就可以了,而有的则需要些checked=“checked”,disabled=“disabled”。比如用attr来获取checked,选中状态获取attr(“checked”)为checked,没有选中则为undefined。。而prop来获取的为,选中为true,没有选中为false。
另外,用prop来设置属性名,html结构是不会发生变化的。而用attr来设置属性名,html结构是会发生变化的。
总的来说,按照我自己的理解,一般如果是标签自身自带的属性,我们用prop方法来获取;如果是自定义的属性,我们用attr方法来获取。