js基础语法

- 1.如何插入js

- 2.引用外部文件

- 3.JS在页面中的位置

javascript作为一种脚本语言可以放在html页面中任何位置，但是浏览器解释html时是按先后顺序的，所以前面的script就先被执行。比如进行任何页面显示初始化的js必须放在head里面，因为初始化都要求提前进行（如给页面body设置cee等）；而如果是通过事件调用执行的function那么对位置没什么要求的。

- 4.什么是变量

语法：var 变量名

- 5.什么是函数

   函数代码;
}```
#- 6.输出内容
`document.write("I love" +"you"+"
");`
#- 7.警告
`alert("xxx");`
#-8. 确认

var message = confirm("你喜欢我吗?");
if(message)
{
当用户点击“确定”按钮时，执行。
}
else
{
当用户点击"取消"按钮时，执行。
}

#- 9.提问（prompt 消息对话框）
语法:`prompt(str1,str2);`
参数说明:
str1:要显示在消息对话框中的文本，不可修改
str2:文本框中的内容，可以修改
返回值:
- 点击确定按钮，文本框中的内容将作为函数返回值。
- 点击取消按钮，将返回null。

#- 10.打开新窗口（window.open）
语法： `window.open([URL],[窗口名称],[参数字符串])`
参数说明：
**URL**:可选参数，在窗口要显示网页的地址或路径。如果省略这个参数，或者它的值是空字符串，那么窗口就不显示任何文档。
**窗口名称**：可选参数，被打开窗口的名称。
- 该名称由字母，数字，下划线字符组成。
- "_top","_blank","_self"具有特殊意义的名称。
     _balnk:在你新窗口显示目标网页
    _self:在当前窗口显示目标网页
    _top:框架网页中在上部窗口中显示目标网页。
- 相同name的窗口只能创建一个，要想创建多个窗口则name不能相同。
- name不能包含有空格。
*参数字符串：*可选参数，设置窗口参数，各参数用逗号隔开。
![参数表](http://img.mukewang.com/52e3677900013d6a05020261.jpg)

例如:打开http://www.imooc.com网站，大小为300px * 200px，无菜单，无工具栏，无状态栏，有滚动条窗口：

#- 11.DOM
文档对象模型DOM(Document Object Model)定义访问和处理HTML文档的标准方法。DOM将HTML文档呈现为带有元素，属性和文本的树结构（节点树）。
- 元素节点：`,,
`等都是元素节点，即标签。
- 文本节点：向用户展示的内容，如`
...
`中的JavaScript,DOM,CSS等文本
- 属性节点 ：如``标签的链接属性`href=""`。

#- 12.DOM-通过ID获取元素
语法：`document.getElementById("id")`.
![doucment.getElementById("ID")-例子](http://img.mukewang.com/52e4c5950001054207900423.jpg)
结果:`null`或`[object HTMLParagraphElement]`
#- 13.DOM-innerHTML属性
语法：`Object.innerHTML`
- Object是获取的元素对象，如通过`document.getElementById("ID")`获取的元素.
- 注意书写，`innerHTML`区分大小写.
通过id="con"获取
元素，并将元素的内容输出和改变元素的内容，代码如下：
![innerHTML-例子](http://img.mukewang.com/52e4cd080001f01507220418.jpg)
结果：
![innerHTML-结果](http://img.mukewang.com/52e4cb5c000187ce03740251.jpg)

#- 14.DOM-修改HTML样式Style
HTML DOM允许 JavaScript改变HTML样式
语法:`Object.style.property=new style;`
![基本属性表](http://img.mukewang.com/52e4d4240001dd6c04850229.jpg)
注意:该表只是一小部分CSS样式属性，其他样式也可以通过该方法设置和修改。
改变
元素的样式，将颜色改为红色，字号20，颜色背景改为蓝.

Hello World!

#- 15.DOM-显示和隐藏(display属性)
语法：`Object.style.display=value`
value值：`none` （此元素不会被显示）隐藏
                 `block` （此元素将显示为块级元素）显示
  ![display-例子](http://img.mukewang.com/52e4dcf50001bead09310689.jpg)
#- 16.DOM-控制类名（className属性）
语法`Object.className=classname`
作用：
- 获取元素的class属性
- 为网页内某个元素指定一个css样式来更改改元素的外观