认识javascript

---

1、两栏自适应布局

---

两栏
html

<div class="layout">
  <div class="left"></div>
  <div class="main"></div>
</div>

css

.layout .left {
  float: left;
  width: 100px;/*设置一个固定宽度*/ 
}
.layout .main {
  margin-left: 100px;/*通过margin-left调整类名为main的div这一栏的左边界位置*/
}

当浏览器宽度发生变化时，类名为main的这一栏就能根据浏览器实际宽度进行宽度调整。

三栏
左右两栏分别设置float:left;和float:right;，并设置所需宽度，中间栏不设置宽度，设置左右两边的margin值即可。

---

2、JavaScript

---

引入JavaScript

在html中插入下列语句即可。要有结束标签。

<script src="文件路径"></script>

给元素添加内容

var label = document.querySelector('.类名');
/*根据类名获取内容，并赋值给变量label*/
label.innerHTML = 'hello world';
/*向对象插入内容hello world*/

给元素添加样式

var a = document.querySelector('.类名');
console.log(a);/*确保获取正确的内容*/
a.style.backgroundColor = '#ffffff';/*Color可以改成其他属性*/

变量和字符串的使用

变量可以代表所获取的内容；
“+”可以连接字符串和变量。

var color = 'rgb(' + red + ',' + green + ',' + blue + ')';

数据类型

数值（int）、字符串（string）、布尔（boolean）、数组（array）、对象（object）、Null、Undefined
int + int 输出 int
string + string 输出 string
int + string 输出 string
字符串类型需要用双引号或单引号括起来。
'100'表示的是字符串而不是数值。

---

3、笔记

---

• 常用的浏览器有哪些，目前的主流分别版本是？ 你能找到市场的占用率数据吗？

  常用浏览器有：
  Chrome浏览器；
  Firefox浏览器（属于Mozilla，网页开发的利器）；
  IE浏览器；
  Safari浏览器；
  UC浏览器（相比PC，移动端用户更多）；
  百度浏览器；
  搜狗浏览器；
  360安全浏览器；
  360极速浏览器；
  QQ浏览器（安装包很小）；
  Edge浏览器（IE的升级版本，现在内置于win10系统中）；
  遨游浏览器；
  Opera浏览器。
  *主流版本有待补充。

世界范围内的桌面浏览器市场占有率
国内桌面浏览器的市场占有率
以上数据来源：浏览迷 » 2017年6月份全球主流浏览器市场份额排行榜

• 变量名，命名有什么规则吗？ 比如 $123 这样是合法的吗？ 中文可以使用吗？

  （1）命名规则

  1、数字、字母(a-z A-Z)、下划线(_)、$组成
  2、不能以数字开头
  3、不能Java的关键字和保留字（有特殊含义）
  如：int、double、class等是关键字；const、goto是保留字；
  4、区分大小写
  如：A和a是不同的变量；INT不是关键字可以做变量名；

  （2）合法；（3）不可以使用中文。