js学习

在页面写入文字

var mystr="hello world!";//变量输出
document.write(mystr);
document.write(mystr+"I love JavaScript"); 
document.write(mystr+"
");//输出后加换行符
//调整页面文字的颜色
document.getElementById("p1").style.color="blue";

如何插入js代码

引入js文件

使用函数

{
 alert("哈哈，调用函数了!");
}```

警告，调试程序
`alert("i love js");`

消息会话框

提问消息对话框

打开/关闭新窗口

window.open([URL], [窗口名称], [参数字符串])
window.open('http://www.imooc.com','fly','width=300,height=200,menubar=no,toolbar=no,status=no,scrollbars=yes')
URL：可选参数，在窗口中要显示网页的网址或路径。如果省略这个参数，或者它的值是空字符串，那么窗口就不显示任何文档。
窗口名称：可选参数，被打开窗口的名称。
1.该名称由字母、数字和下划线字符组成。
2."_top"、"_blank"、"_selft"具有特殊意义的名称。 _blank：在新窗口显示目标网页 _self：在当前窗口显示目标网页 _top：框架网页中在上部窗口中显示目标网页
3.相同 name 的窗口只能创建一个，要想创建多个窗口则 name 不能相同。
4.name 不能包含有空格。参数字符串：可选参数，设置窗口参数，各参数用逗号隔开。
window.close(); //关闭本窗口
<窗口对象>.close(); //关闭指定的窗口

![Paste_Image.png](http://upload-images.jianshu.io/upload_images/1009044-93c9c28dcbc68bdf.png?imageMogr2/auto-orient/strip%7CimageView2/2/w/1240)

通过ID获取元素

![Paste_Image.png](http://upload-images.jianshu.io/upload_images/1009044-5be0cc0d2cada7ca.png?imageMogr2/auto-orient/strip%7CimageView2/2/w/1240)

获取或替换HTML元素的内容：innerHTML

![Paste_Image.png](http://upload-images.jianshu.io/upload_images/1009044-fa4aa0fc898145de.png?imageMogr2/auto-orient/strip%7CimageView2/2/w/1240)

改变HTML样式style.*

显示和隐藏style.display

function hidetext()
{
var mychar = document.getElementById("con");
mychar.style.display="none";//block显示为块级元素
}

控制类名className

作用：
1.获取元素的class 属性

2. 为网页内的某个元素指定一个css样式来更改该元素的外观

比较：
两个操作数通过比较操作符进行比较，得到值为真（true）和假(false)。

jq1= numa>numb ;
jq2= numa!=numb ;
document.write("numa大于numb的分数吗？"+jq1+"
")
document.write("numa不等于numb的分数吗？"+ jq2);

函数：
第一种情况:在
 
 
第二种情况:在HTML文件中调用，如通过点击按钮后调用定义好的函数。
 
 

 
 
 
 
 

  //按钮,onclick点击事件，直接写函数名
 
 
 
 
 

事件：
 网页中的每个元素都可以产生某些可以触发 JavaScript 函数或程序的事件。

![Paste_Image.png](http://upload-images.jianshu.io/upload_images/1009044-f02738ffd0b25c49.png?imageMogr2/auto-orient/strip%7CimageView2/2/w/1240)
 
 
 //点击
  //鼠标划过
 点击我 //鼠标移开
 
 

  //聚焦
 学生
 教师
 工程师
 演员
 会计
 
 
 
 
 //失焦
 
 
请写入个人简介，不少于200字！ //选中事件
 
 
请写入个人简介，不少于200字！ //文本内容改变
 
 
 //加载页面时，弹出对话框“加载中，请稍等…”。onload 常用在  中，
 一旦完全加载所有内容（包括图像、脚本文件、CSS 文件等），就执行一段脚本。
 
 

对象：
JavaScript 提供多个内建对象，比如 String、Date、Array 等等，使用对象前先定义。
 
 
var objectName =new Array();//使用new关键字定义对象
 或者
 var objectName =[];
 var myarray=new Array(6);//定义数组对象
 var myl=myarray.length;//访问数组长度length属性
 
 

浏览器对象BOM
window对象:
 
 
window.history.length;
 window.history.back(); //forward();go();back()相当于go(-1),forward()相当于go(1)
 
 

location对象：

![对象属性图示](http://upload-images.jianshu.io/upload_images/1009044-619704290e58a92e.png?imageMogr2/auto-orient/strip%7CimageView2/2/w/1240)

![location对象方法](http://upload-images.jianshu.io/upload_images/1009044-5fcc921000ad5216.png?imageMogr2/auto-orient/strip%7CimageView2/2/w/1240)

Navigator对象：
Navigator 对象包含有关浏览器的信息，通常用于检测浏览器与操作系统的版本。

![Navigator对象属性](http://upload-images.jianshu.io/upload_images/1009044-03d48b0d88a78d9e.png?imageMogr2/auto-orient/strip%7CimageView2/2/w/1240)

 
 
//查看浏览器名称和版本
 
 
 

DOM对象
`getElementById() `方法可返回对拥有指定 ID 的第一个对象的引用（返回的是DOM Element）。
`getElementsByName()`方法返回带有指定名称的节点对象的集合。
因为文档中的 name 属性可能不唯一，所有 getElementsByName() 方法返回的是元素的数组，而不是一个元素。
和数组类似也有length属性，可以和访问数组一样的方法来访问，从0开始。
`getElementsByTagName()方法`返回带有指定标签名（如input，li等）的节点对象的集合。返回元素的顺序是它们在文档中的顺序。

DOM对象的属性：
使用"."运算符 和 `getAttribute（setAttribute）`通过元素节点的属性名称获取属性的值。
语法：
`elementNode.getAttribute(name)`
`elementNode.setAttribute(name,value)`增加一个指定名称和值的新属性，或者把一个现有的属性设定为指定的值。
这两个方法只能通过元素节点对象调用。

名词elementNode：使用getElementById()、getElementsByTagName()等方法，获取到的元素节点。
name：要想查询的元素节点的属性名字
 
 

 var e = document.getElementById('test');
 alert(e.id);//'test'
 alert(e.className);//'cls'
 alert(e.ss);//undefined(IE下为 'ss');
 //注意浏览器差异
 alert(e.getAttribute('class'));//'cls'(Firefox)
 alert(e.getAttribute('className'));//'cls'(IE)
 //用getAttribute 来引用，可以访问自定义属性，不区分大小写。
 alert(e.getAttribute('id'));//'test'
 alert(e.getAttribute('ID'));//'test'
 //对于自定义属性，使用.运算符的设置的属性无法通过getAttribute获取，反之亦然。
 //对于style,className的设置，通常是使用.运算符来实现
 el.style.backgroundColor = 'blue';
 el.className = 'nav';//works in all browers.