学习随笔

发表于 更新于 分类于 本文字数： 1k 阅读时长 ≈ 3 分钟

bootstrap 的 js 文件中函数面前‘+’号是什么意思？
相当于 (function ($) {…})($)，意思就是把当前这个闭包立即执行。注意这个函数末尾有 ($)，千万不要以为函数前面加个 + 就会执行。
如果不写 + 直接写 function () {…}()，这会造成 js 语法错误，这是因为 function () {…} 是函数声明，它不是表达式，它必须有一个名字。但就算有了名字，它也不会返回函数，在后面加 () 并不会变成函数调用，而是变成简单的括号表达式。
而前面写了个 + 之后 +function () {…}() 变成一个表达式，末尾的 () 由于运算优先级高会先执行，于是就把刚定义的函数执行了一遍。
现在流行这样写大概是因为比加括号的写法少一个字符吧

无论在标签中 class 属性里类的顺序如何，最终相同的属性值取 css 文件中权重最大或者权重一样但声明位置最后的那个。

Mac 中设置在当前目录中打开 Terminal：System Preferences -> Keyboard -> Shortcuts -> Services -> New Terminal at Folders/New Terminal Tab at Folder 这二项都勾上。在目录上的菜单里就有。

CSS 中，列表项若 display 不为 list-item, 则前面的列表项符号消失.

对于两栏布局右栏自适应，左栏左浮动，右栏块级元素会从浮动处向行末自动填满，再设置合适的 margin-left 即可实现左栏定宽右栏自适应。使用两栏布局时，有几点特别需要注意:

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
.secondary {
	overflow: auto;
	width: auto;
	margin-left: 220px;
	margin-right: 0;
}

.secondary .content-wrap {
	width: 100%;
	float: left; /* 这一步很关键 */

}
.content {
	margin-right: 140px;
	min-height: 200px;
	background-color: white;
	padding: 20px;
	min-width: 200px;
}

<div class="secondary">
	<div class="content-wrap">
		<div class="content">sfdefsfefes</div>
	</div>
	<div class="secondary">
		<div class="self-logo1">个人logo</div>
		<div class="self-logo2">个人logo</div>
		<div class="self-logo3">个人logo</div>
		<div class="self-logo4">个人logo</div>
	</div>
</div>

以上摘自本人写的浮动 + 负 margin 三栏布局片段. secondary 为右两栏，左栏左浮不再贴出来。需要注意的是，用负 margin 使顶宽栏移动到上一行时，内容区需要一个包裹层，并将此包裹层设置为 float:left (float 无继承性，内容层不用 float:none), width: 100%, 对于内容层，将右侧 margin 设为顶宽右栏的宽度即可。其中，内容区的包裹层起到一个接收的作用，若没有这一层的 float, 则不能将下层元素通过负 margin 移动到上一行.

border-radius 使用：这个为 css3 的属性，可以为框的四个角添加圆角。可以设置 1 到 4 个值，值复制情况与 padding,margin 一致。第一个值为左上角，第二个为右上角，顺时针转动。可以设置两组值，用 / 分开，此时第一组值表示水平距离，后一组表示垂直距离。应用举例:

1
2
3
4
5
6
7
8
9
10
11
12
# 4分之1 圆
background-color: orange;
width: 50px;
height: 50px;
border-radius: 50px 0 0 0;

# 吃豆人
width:0;
height:0;
border:100px solid gray;
border-radius:100px;
border-right-color:#fff;

使元素居中的一点总结:
水平居中：对于有块级父元素的内联元素或 inline-*, 可以在父元素上使用 text-align: center; 对于块级元素的居中，可以设置宽度后使用 margin: 0 auto.
垂直居中：对于单行 inline 或 inline-* 元素，可以加上下相同的 padding, 或者使用 line-height 使之等于 height; 多行文本可以使用 vertical-align: middle; 对块级定宽元素，使用相对定位 + 决定定位 top:50%; margin-top: -width/2; 若不定宽，则不用负 margin, 使用 transform: translate (-50%, -50%). 这个属性是基于当前元素的宽高.

js 中什么时候，new 对来的对象，使用严格相等运算法返回 true?
比如，var g1 = new A (); 如果 A 返回为一个似有静态成员，则为 true; 即，使用闭包保存似有静态成员，并返回这个成员，则所有 new 出来的对象都是同一个引用.