一、display:inline ,inline-block,block,none释义
- inline
该元素生成一个或多个行内元素盒 - block
该元素生成一个块元素盒 - inline-block
该元素生成一个块状盒,该块状盒随着周围内容流动,如同它是一个单独的行内盒子(表现更像是一个被替换的元素)
结合了行内元素和块级元素的特点。对元素设置该属性后,实现的效果是:元素成为一个块状的盒子,然后行内排列(随界面的宽度变化而换行),同时可以对元素设置宽高 - list-item
该元素生成一个容纳内容和单独的列表行内元素盒的块状盒 - none
关闭一个元素的显示,这样其后代元素都会同时隐藏。文档在渲染的时候,该元素如同不存在。区别于visibility: hidden ,visibility: hidden 元素不显示但是还是会占据原来的空间 - table
这个元素的作用就像<table>
元素. 它定义了一个块级盒子. - table-row
这个元素的作用就像<tr>
一样. - table-cell
这个元素的作用就像<td>
一样
利用td特有的垂直居中及拉伸属性
二、object.key 与 object[key]的区别
js读取属性有2种方式:object.key与object[key]。那么究竟二者在使用上有什么区别呢
例:
var obj ={key1:value1,key2:value2}
注意:对象的key类型是字符串 - 区别1:
如果使用.来访问属性值,可写为obj.key1
如果使用[]来访问属性值,则写为obj['key1']。(键名必须带引号,否则被当变量处理)。如下:obj[foo] 输出为2
var foo = 'bar';
var obj = {
foo: 1,
bar: 2
};
obj.foo // 1
obj[foo] // 2 - 区别2
如果键名是数值,则不能通过.运算符访问属性值。例如:
var obj = {
231: 1,
bar: 2
};
obj.231 //报错
obj.[231] //如果是数值key,引号可以不加 - 区别3
最近在用angular做项目时遇到的一个问题。比如$scope.name 、$scope.value都是从界面上拿到用户输入的值,现在想把它们组成对象的键值对,形式如下:var data ={$scope.name:$scope.value}
//假设$scope.name=“name” $scope.value = “6”//
第一种方式:data.$scope.name = $scope.value
首先会报错:Uncaught SyntaxError: Unexpected token .。不能识别这个点。其次,如果var f = $scope.name,然后data.f = $scope.value,则打出对象是{f:6},明显不是我们要的结果
第二种方式:data[$scope.name] = $scope.value
但是如果用这种方式,打出对象是{name:6}
原因:如果key值并不确定,而是一个变量的时候,则只能通过obj[someKey]的方式访问。
data.key 代表 data里面name = "key"的value
data[key] 代表data里面name = key 的value
ng-bind ng-model {{}}的区别