慕课网

精品课程 JavaScript进阶篇

JavaScript进阶篇

最热最新

虎耳草

<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>实践题 - 选项卡</title>
<style type="text/css">
/* CSS样式制作 */
*{margin:0;padding:0;font:normal 12px "微软雅黑";color:#000000;}
ul{list-style-type: none;}
a{text-decoration: none;}

#tab-list{width: 275px;height:190px;margin: 20px auto;}

#ul1{border-bottom: 2px solid #8B4513;height: 32px;}
#ul1 li{display: inline-block;width: 60px;line-height: 30px;text-align: center;border: 1px solid #999;border-bottom: none;margin-left: 5px;}
#ul1 li:hover{cursor: pointer;}
#ul1 li.active{border-top:2px solid #8B4513;border-bottom:2px solid #FFFFFF;}

#tab-list div{border: 1px solid #7396B8;border-top: none;}
#tab-list div li{height: 30px;line-height: 30px;text-indent: 8px;}

.show{display: block;}.hide{display: none;}
</style>
<script type="text/javascript">

window.onload = function() {
var oUl1 = document.getElementById("ul1");
var aLi = oUl1.getElementsByTagName("li");
var oDiv = document.getElementById("tab-list");
var aDiv = oDiv.getElementsByTagName("div");
for(var i = 0; i < aLi.length; i++) {
aLi[i].index = i;
aLi[i].onmouseover = function() {
for(var i = 0; i < aLi.length; i++) {
aLi[i].className = "";
}
this.className = "active";
for(var j = 0; j < aDiv.length; j++) {
aDiv[j].className = "hide";
}
aDiv[this.index].className = "show";
}
}
}


</script>

</head>
<body>

<div id="tab-list">
<ul id="ul1">
<li class="active">房产</li><li>家居</li><li>二手房</li>
</ul>
<div>
<ul>
<li><a href="javascript:;">275万购昌平邻铁三居总价20万买一居</a></li>
<li><a href="javascript:;">200万内购五环三居 140万安家东三环</a></li>
<li><a href="javascript:;">北京首现零首付楼盘 53万购东5环50平</a></li>
<li><a href="javascript:;">京楼盘直降5000 中信府公园楼王现房</a></li>
</ul>
</div>
<div class="hide">
<ul>
<li><a href="javascript:;">40平出租屋大改造美少女的混搭小窝</a></li>
<li><a href="javascript:;">经典清新简欧爱家 90平老房焕发新生</a></li>
<li><a href="javascript:;">新中式的酷色温情 66平撞色活泼家居</a></li>
<li><a href="javascript:;">瓷砖就像选好老婆卫生间烟道的设计</a></li>
</ul>
</div>
<div class="hide">
<ul>
<li><a href="javascript:;">通州豪华3居260万二环稀缺2居250w甩</a></li>
<li><a href="javascript:;">西3环通透2居290万 130万2居限量抢购</a></li>
<li><a href="javascript:;">黄城根小学学区仅260万 121平70万抛!</a></li>
<li><a href="javascript:;">独家别墅280万苏州桥2居优惠价248万</a></li>
</ul>
</div>
</div>

</body>
</html>

查看全部

1 采集收起来源：编程挑战
2018-05-20
qq_借个背包就出发_03588511

<table>代表表格</table>
<tr>代表表格中的一行</tr>
<td>代表表格中的一列</td>

'tr'与'td'交成一个单元格
<table>...</table>之间有多少个<tr>，就有多少行
<tr>...</tr>之间有多少个<td>，就有多少列

查看全部

0 采集收起来源：getElementsByTagName()方法
2018-05-20
qq_借个背包就出发_03588511
getElementsByName()方法
返回带有指定名称的节点对象的集合。
语法：
```
document.getElementsByName(name)
```
与getElementById() 方法不同的是，通过元素的 name 属性查询元素，而不是通过 id 属性。
注意:
1. 因为文档中的 name 属性可能不唯一，所有 getElementsByName() 方法返回的是元素的数组，而不是一个元素。
2. 和数组类似也有length属性，可以和访问数组一样的方法来访问，从0开始。
看看下面的代码:
运行结果:
查看全部

0 采集收起来源：getElementsByName()方法
2018-05-20
qq_两脚踢翻尘世界_0

var myarr=new Array(2);
document.write("111");
for（var i=0;i<3;i++){
myarr[i]=new Array(5);
for(var j=0;j<5;j++){
myarr[i][j]=i+j;
document.write(myarr[i][j]);
}

}
为什么运行不了？？？？

查看全部

0 采集收起来源：二维数组
2018-05-20
qq_两脚踢翻尘世界_0

数组array（）

查看全部

0 采集收起来源：谁是团里成员（数组赋值）
2018-05-20
新时代IT民工

1,获取元素的值设置和获取方法：
赋值： document.getElementById("fruit").value = result;
取值：var oTxt1 = document.getElementById("txt1").value;
2，使用parseInt()函数可解析一个字符串,并返回一个整数。

查看全部

0 采集收起来源：编程练习
2018-05-20
qq_借个背包就出发_03588511
screen对象
screen对象用于获取用户的屏幕信息。
语法：
```
window.screen.属性
```
对象属性:
查看全部

0 采集收起来源：screen对象
2018-05-20
新时代IT民工

卸载事件（onunload）:当用户推出页面时，（页面刷新，页面关闭等），触发事件onunload事件，同时执行被调用的程序。
window.onunload=onunload_message();

查看全部

0 采集收起来源：卸载事件（onunload）
2018-05-20
新时代IT民工

加载事件（onload）：事件会在页面加载完成后，立即发生，同时执行被调用的程序。
注意:1,触发事件，应写在<body>标签内。
2，可以写在一个新的页面中，当你打开一个新的页面，弹出对话框“加载中，请稍等...”

查看全部

0 采集收起来源：加载事件（onload）
2018-05-20
新时代IT民工

内容选中事件（onselect）:当文本框或文本域中的文字被选中时候，触发onselect事件，并调用函数message（）。

查看全部

0 采集收起来源：内容选中事件（onselect）
2018-05-20
新时代IT民工

失焦事件（onblur）:当光标离开当前获得聚焦对象的时候，触发onblur事件，同时执行被调用的程序。
例：网页中有用户名和密码两个文本框。当前光标在用户文本框时，离开文本框后，触发onblur事件，并调用函数message（）。

查看全部

0 采集收起来源：失焦事件（onblur）
2018-05-20
新时代IT民工

当网页中的对象获得聚点时，执行onfocus调用的程序就会被执行，即当光标移动到文本框时，焦点就在文本框内，触发onfocus事件，并调用函数message().

查看全部

0 采集收起来源：光标聚焦事件（onfocus）
2018-05-20
phontom_infinity

//在不同浏览器都实用的 JavaScript 方案：
//一、对于IE9+、Chrome、Firefox、Opera 以及 Safari;二、对于 IE8、7、6、5：
var w= document.documentElement.clientWidth
|| document.body.clientWidth;
var h= document.documentElement.clientHeight
|| document.body.clientHeight;
document.write("宽度"+w+"<br>高度"+h);

查看全部

0 采集收起来源：浏览器窗口可视区域大小
2018-05-20
慕数据7366584

<script type="text/JavaScript">
var myweek =3;//myweek表示星期几变量
switch(myweek)
{
case 1:
case 2:
document.write("学习理念知识");
break;
case 3:
case 4:
document.write("到企业实践");
break;
case 5:
document.write("总结经验");
break;
case 6:
case 7:
document.write("周六、日休息和娱乐");
break;
default:
document.write("你输入的是什么鬼？")；
}
</script>

//不能忘记default的情况

查看全部

0 采集收起来源：多种选择（Switch语句)
2018-05-20
慕数据7366584

<script type="text/javascript">
//创建数组
var myarr = ['6','66','666'];
myarr[3] = '6666';
//显示数组长度
alert(myarr.length);

//将数组内容输出，完成达到的效果。
for(var i = 0;i<4;i++){
document.write(myarr[i] + '<br>');
}

//可以利用for循环的方法

查看全部

0 采集收起来源：编程练习
2018-05-20

首页上一页 794 795 796 797 798 799 800 下一页尾页

0/150

提交

取消

开始学习

课程须知: 你需要具备HTML、css基础知识，建议同学们也可以想学习下js入门篇，快速认识js，熟悉js基本语法，更加快速入手进阶篇！

老师告诉你能学到什么？: 通过JavaScript学习，掌握基本语法，制作简单交互式页面

JavaScript进阶篇

getElementsByName()方法

screen对象