慕课网

精品课程 JavaScript进阶篇

JavaScript进阶篇

最热最新

慕侠4886741

var mydate=new Date();
document.write("当前时间："+mydate+"<br>");

查看全部

0 采集收起来源：返回/设置时间方法
2019-01-10
慕雪4950640

什么是事件
JavaScript 创建动态页面。事件是可以被 JavaScript 侦测到的行为。网页中的每个元素都可以产生某些可以触发 JavaScript 函数或程序的事件。
比如说，当用户单击按钮或者提交表单数据时，就发生一个鼠标单击（onclick）事件，需要浏览器做出处理，返回给用户一个结果。
主要事件表:

查看全部

0 采集收起来源：什么是事件
2019-01-10
蛋切刀

document.write(arr[0] + "<br/>");
document.write(arr[7] + "<br/>");
document.write(arr[2] + "<br/>");
document.write(arr[4] + "<br/>");

查看全部

0 采集收起来源：编程练习
2019-01-10
慕粉4092391
“=” 操作符是赋值，不是等于
“+”不只代表加法，还可以连接两个字符串
```
mystring = "Java" + "Script"; // mystring的值“JavaScript”这个字符串
```
查看全部

0 采集收起来源：我还有其它用途( +号操作符）
2019-01-10

慕雪4950640

谁是团里成员（数组赋值）

数组创建好，接下来我们为数组赋值。我们把数组看似旅游团的大巴车，大巴车里有很多位置，每个位置都有一个号码，顾客要坐在哪个位置呢？

第一步：组个大巴车 第二步：按票对号入座         大巴车的1号座位是张三         大巴车的2号座位是李四

数组的表达方式：

第一步：创建数组var myarr=new Array();  第二步：给数组赋值         myarr[1]=" 张三";         myarr[2]=" 李四";

下面创建一个数组，用于存储5个人的数学成绩。

var myarray=new Array(); //创建一个新的空数组 myarray[0]=66; //存储第1个人的成绩 myarray[1]=80; //存储第2个人的成绩 myarray[2]=90; //存储第3个人的成绩 myarray[3]=77; //存储第4个人的成绩 myarray[4]=59; //存储第5个人的成绩

注意：数组每个值有一个索引号，从0开始。

我们还可以用简单的方法创建上面的数组和赋值：

第一种方法：

var myarray = new Array(66,80,90,77,59);//创建数组同时赋值

第二种方法：

 var myarray = [66,80,90,77,59];//直接输入一个数组（称 “字面量数组”）

注意：数组存储的数据可以是任何类型（数字、字符、布尔值等）

查看全部

0 采集收起来源：谁是团里成员（数组赋值）

2019-01-09

慕雪4950640
保持先后顺序(操作符优先级）
我们都知道，除法、乘法等操作符的优先级比加法和减法高，例如：
```
var numa=3; var numb=6 jq= numa + 30 / 2 - numb * 3;  // 结果为0
```
如果我们要改变运算顺序，需添加括号的方法来改变优先级:
```
var numa=3; var numb=6 jq= ((numa + 30) / (2 - numb)) * 3; //结果是-24.75
```
操作符之间的优先级（高到低）:
算术操作符比较操作符逻辑操作符 "="赋值符号
如果同级的运算是按从左到右次序进行,多层括号由里向外。
```
var numa=3; var numb=6; jq= numa + 30 >10 && numb * 3<2;  //结果为false
```
查看全部

0 采集收起来源：保持先后顺序(操作符优先级）
2019-01-09
慕雪4950640
给变量取个名字(变量命名)
我们为了区分盒子，可以用BOX1,BOX2等名称代表不同盒子，BOX1就是盒子的名字（也就是变量的名字）。
我们赶快给变量取个好名字吧!变量名字可以任意取，只不过取名字要遵循一些规则:
1.必须以字母、下划线或美元符号开头，后面可以跟字母、下划线、美元符号和数字。如下:
```
正确:                mysum                 _mychar              $numa1
```
```
错误:   6num  //开头不能用数字   %sum //开头不能用除(_ $)外特殊符号,如(%  + /等)   sum+num //开头中间不能使用除(_ $)外特殊符号，如(%  + /等)
```
2.变量名区分大小写，如:A与a是两个不同变量。
3.不允许使用JavaScript关键字和保留字做变量名。
查看全部

0 采集收起来源：给变量取个名字(变量命名)
2019-01-09
qq_老阿姨_afkFIS

<!DOCTYPE html>
<html>
<head>
<title> 事件</title>
<script type="text/javascript">
function count(){
var a=document.getElementById("txt1").value;
var b=document.getElementById("txt2").value;
var c=document.getElementById("select").value;
var d;
switch(c){
case "+":d=a+b;break;
case "-":d=a-b;break;
case "*":d=a*b;break;
}
document.getElementById("fruit").value=d;
</script>
</head>
<body>
<input type='text' id='txt1' />
<select id='select'>
<option value='+'>+</option>
<option value="-">-</option>
<option value="*">*</option>
<option value="/">/</option>
</select>
<input type='text' id='txt2' />
<input type='button' value=' = ' onclick="count()" /> 
<input type='text' id='fruit' />
</body>
</html>

查看全部

1 采集收起来源：编程练习
2019-01-09
CrazyCatMort

跳过空白节点 obj.nodeType==1

查看全部

0 采集收起来源：访问子节点childNodes
2019-01-09
FreudLi
offsetHeight和offsetWidth，获取网页内容高度和宽度(包括滚动条等边线，会随窗口的显示大小改变)。
一、值
offsetHeight = clientHeight + 滚动条 + 边框。
二、浏览器兼容性
```
var w= document.documentElement.offsetWidth
    || document.body.offsetWidth;
var h= document.documentElement.offsetHeight
    || document.body.offsetHeight;
```
查看全部

0 采集收起来源：网页尺寸offsetHeight
2019-01-09
FreudLi
scrollHeight和scrollWidth，获取网页内容高度和宽度。
一、针对IE、Opera:
scrollHeight 是网页内容实际高度，可以小于 clientHeight。
二、针对NS、FF:
scrollHeight 是网页内容高度，不过最小值是 clientHeight。也就是说网页内容实际高度小于 clientHeight 时，scrollHeight 返回 clientHeight 。
三、浏览器兼容性
```
var w=document.documentElement.scrollWidth
   || document.body.scrollWidth;
var h=document.documentElement.scrollHeight
   || document.body.scrollHeight;
```
查看全部

0 采集收起来源：网页尺寸scrollHeight
2019-01-09
你会瘦

<!doctype html>
<html>
<head>
<meta charset="utf-8">
<title>简易计算器</title>
<script type="text/javascript">
function count(){
var ch = document.getElementById("select").value;
var ch1 = document.getElementById("txt1").value;
var ch2 = document.getElementById("txt2").value;
var sum;
var num1 = parseInt(ch1);
var num2 = parseInt(ch2);//从input中获取的value是字符类型不能直接进行加减需要转换成数字
/* var num1 = parseInt(document.getElementById("txt1").value);
var num2 = parseInt(document.getElementById("txt2").value); 另一种更简便写法*/
if(ch=='+') sum=num1+num2;
if(ch=='-') sum=num1-num2;
if(ch=='*') sum=num1*num2;
if(ch=='/') sum=num1/num2;
document.getElementById("fruit").value = sum;
}
</script>
</head>

<body>
<input type="text" id="txt1" />
<select id="select">
<option value="+">+</option>
<option value="-">-</option>
<option value="*">*</option>
<option value="/">/</option>
</select>
<input type="text" id="txt2" />
<input type="button" value=" = " onclick="count()" /> 
<input type="text" id="fruit" />
</body>
</html>

查看全部

0 采集收起来源：编程练习
2019-01-09
FreudLi

一、对于IE9+、Chrome、Firefox、Opera 以及 Safari：
• window.innerHeight - 浏览器窗口的内部高度
• window.innerWidth - 浏览器窗口的内部宽度
二、对于 Internet Explorer 8、7、6、5：
• document.documentElement.clientHeight表示HTML文档所在窗口的当前高度。
• document.documentElement.clientWidth表示HTML文档所在窗口的当前宽度。
或者
Document对象的body属性对应HTML文档的<body>标签
• document.body.clientHeight
• document.body.clientWidth

查看全部

0 采集收起来源：浏览器窗口可视区域大小
2019-01-09
慕斯卡7430691
创建元素节点createElement
createElement()方法可创建元素节点。此方法可返回一个 Element 对象。
语法：
```
document.createElement(tagName)
```
参数:
tagName：字符串值，这个字符串用来指明创建元素的类型。
注意：要与appendChild() 或 insertBefore()方法联合使用，将元素显示在页面中。
我们来创建一个按钮，代码如下：
```
<script type="text/javascript">    var body = document.body;    var input = document.createElement("input");      input.type = "button";      input.value = "创建一个按钮";      body.appendChild(input);    </script>
```
效果：在HTML文档中，创建一个按钮。
我们也可以使用setAttribute来设置属性，代码如下：
```
<script type="text/javascript">      var body= document.body;                 var btn = document.createElement("input");      btn.setAttribute("type", "text");      btn.setAttribute("name", "q");      btn.setAttribute("value", "使用setAttribute");      btn.setAttribute("onclick", "javascript:alert('This is a text!');");           body.appendChild(btn);   </script>
```
效果：在HTML文档中，创建一个文本框，使用setAttribute设置属性值。当点击这个文本框时，会弹出对话框“This is a text!”。
任务
试一试，实现在HTML文档中创建一个链接，并设置相应属性。
1. 在右边编辑器补充代码，完善createa(url,text)创建链接函数，参数1为链接地址，参数2为链接文本。函数中添加链接地址、文本、文字颜色属性。
2. 调用createa函数，链接地址 http://www.imooc.com，文本为:慕课网
查看全部

0 采集收起来源：创建元素节点createElement
2019-01-09
慕斯卡7430691
替换元素节点replaceChild()
replaceChild 实现子节点(对象)的替换。返回被替换对象的引用。
语法：
```
node.replaceChild (newnode,oldnew ) 
```
参数：
newnode : 必需，用于替换 oldnew 的对象。
oldnew : 必需，被 newnode 替换的对象。
我们来看看下面的代码:

效果: 将文档中的 Java 改为 JavaScript。
注意:
1. 当 oldnode 被替换时，所有与之相关的属性内容都将被移除。
2. newnode 必须先被建立。
任务
试一试，补充函数 replaceMessage() 代码，实现将 b 标签替换成 i 标签。
查看全部

0 采集收起来源：替换元素节点replaceChild()
2019-01-09