<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

<html xmlns="http://www.w3.org/1999/xhtml">

<head>

<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />

<title>无标题文档</title>

<style>

#cd1{ width:100px; height:175px; background-color:#900; color:#0F0; text-align:center; vertical-align:middle; line-height:35px; }

#cd2{ width:100px; height:175px; background-color:#900; color:#0F0; text-align:center; vertical-align:middle; line-height:35px; }

#cd3{ width:100px; height:175px; background-color:#900; color:#0F0; text-align:center; vertical-align:middle; line-height:35px; }

#a1{ width:100px; height:35px; background-color:#0F0; text-align:center; vertical-align:middle; line-height:34px; border:1px solid #000;}

#a2{ width:100px; height:35px; background-color:#0F0; text-align:center; vertical-align:middle; line-height:34px; border:1px solid #000;}

</style>

</head>

<body>

    <div style=" width:100px; height:35px;  color:#0F0; text-align:center; vertical-align:middle; line-height:35px;" onclick="xiala()">首页</div>

    <div id="cd1" style=" display:none">

    <div>企业介绍</div>

    <div>产品介绍</div>

    <div>产品中心</div>

    <div>服务中心</div>

    <div>联系我们</div>

    </div>

    <div style=" width:100px; height:35px;  color:#0F0; text-align:center; vertical-align:middle; line-height:35px;" onclick="xiala2()">企业介绍</div>

    <div id="cd2" style=" display:none">

    <div>产品介绍</div>

    <div>产品中心</div>

    <div>服务中心</div>

    <div>联系我们</div>

    </div>

    <div style=" width:100px; height:35px;  color:#0F0; text-align:center; vertical-align:middle; line-height:35px;" onclick="xiala3()">产品中心</div>

    <div id="cd3" style=" display:none">

    <div>产品介绍</div>

    <div>产品中心</div>

    <div>服务中心</div>

    <div>联系我们</div>

    </div>

<br />

<br />

<br />

<!--<div style="width:600px; height:35px; border:1px solid #000; text-align:center; vertical-align:middle; line-height:35px; color:#F00;">-->

    <div id="a1" style="overflow:hidden" onmouseover="chuxian()" onmouseout="yincang()">

    <div id="a2">产品介绍</div>

    <div id="a2">产品中心</div>

    <div id="a2">企业介绍</div>

    <div id="a2">联系我们</div>

    </div>

</div>

</body>

</html>

<script type="text/jscript">

function xiala(a)

{

    var a = document.getElementById("cd1");

    var str="none";

    if(str.indexOf(a.style.display)>=0)

    {

    a.style.display="block";

    }

    else(a.style.display="none")

}

function xiala2()

{

    var a = document.getElementById("cd2");

    var str="none";

    if(str.indexOf(a.style.display)>=0)

    {

    a.style.display="block";

    }

    else a.style.display="none";

}

function xiala3()

{

    var a = document.getElementById("cd3");

    var str="none";

    if(str.indexOf(a.style.display)>=0)

    {

    a.style.display="block";

    }

    else a.style.display="none";

}

function chuxian()

{

    var a = document.getElementById("a1");

    a.removeAttribute("style");

}

function yincang()

{

    var a = document.getElementById("a1");

    a.setAttribute("style","overflow:hidden");

}

</script>

11.10document对象练习的更多相关文章

  1. redis 系列11 列表对象

    一. 列表对象概述 Redis列表是简单的字符串列表,按照插入顺序排序.你可以添加一个元素到列表的头部(左边)或者尾部(右边).一个列表最多可以包含 232 - 1 个元素 (4294967295, ...

  2. ES6躬行记（11）——对象

    在第5篇中,讲解了多个对象字面量的改进,本节将重点介绍两个新增的静态方法,以及对象属性的重复处理和枚举顺序. 一.Object.is() 此方法用于判断两个值是否相同,内部实现了SameValue算法 ...

  3. Day 11 函数对象，函数嵌套，作用域，闭包

    函数总结 # 函数的定义:def func(a, b):    print(a, b)    return a + b​​# 函数四个组成部分# 函数名:调用函数的依据,必须的# 函数体:执行函数逻辑 ...

  4. python --- 11 第一类对象 函数名 闭包 迭代器

    一 .函数名的运用    ①函数名是⼀个变量, 但它是⼀个特殊的变量, 与括号配合可以执⾏函数的变量 ②函数名是一个内存地址    ③ 函数名可以赋值给其他变量         ④函数名可以当做容器类 ...

  5. python之路---11 第一类对象 函数名 闭包 迭代器

    二十九. 1.函数名的运用    ①函数名是⼀个变量, 但它是⼀个特殊的变量, 与括号配合可以执⾏函数的变量 ②函数名是一个内存地址    ③ 函数名可以赋值给其他变量         ④函数名可以当 ...

  6. JavaScript高级 面向对象（11）--对象的动态特性-关联数组用法

    说明(2017.4.2): 1. 对象的动态特性: (1)在js中,一个对象需要属性,就可以利用“对象名.属性 = 值”的方式为其添加,只要赋值成功,对象就新增这个属性. (2)对象属性的访问形式: ...

  7. C++解析(11)：对象的构造

    0.目录 1.对象的初始化 2.构造函数 3.无参构造函数与拷贝构造函数 4.小结 1.对象的初始化 对象中成员变量的初始值是多少? 下面的类定义中成员变量i和j的初始值是什么? 从程序设计的角度,对 ...

  8. 【VBA编程】11.Application对象

    Application对象常用属性[ActiveCell属性]ActiveCell属性返回一个Range对象,表示当前窗口或指定窗口中的单元格.如果窗口没显示工作表,则此属性无效.[代码区域] Sub ...

  9. 11 Reponse对象+ServletContext对象

    1.HTTP协议: (1)请求消息:客户端发送给服务器端的数据 数据格式: 1. 请求行 2. 请求头 3. 请求空行 4. 请求体 (2)响应消息:服务器端发送给客户端的数据 * 数据格式: 1. ...

随机推荐

  1. Shell script fails: Syntax error: “(” unexpected

    Shell script fails: Syntax error: “(” unexpected google 一下. http://unix.stackexchange.com/questions/ ...

  2. springmvc中的几个问题

    一   url-pattern的问题: <!-- No mapping found for HTTP request with URI [/WEB-INF/jsp/homePage.jsp] i ...

  3. mysql 不能插入中文

    三.#vim /etc/mysql/my.cnf .(5.5以前系统)在[client]下面加入 default-character-set=utf8 在[mysqld]下面加入default-cha ...

  4. [转]SSL协议详解

    背景介绍    最近在看<密码学与网络安全>相关的书籍,这篇文章主要详细介绍一下著名的网络安全协议SSL. 在开始SSl介绍之前,先给大家介绍几个密码学的概念和相关的知识.     1.密 ...

  5. css 8.1

    1. border-collapse 属性设置是否将表格边框折叠为单一边框: table { border-collapse:collapse;  } 如果没有规定 !DOCTYPE,border-c ...

  6. UVA - 10048 Audiophobia （Floyd应用）

    题意:求出两点之间所有路径最大权值的最小值. 思路:转变一下Floyd的形式即可: 注意:注意初始化问题,还有UVA奇葩的输出形式. 代码如下: #include<iostream> #i ...

  7. Python基础学习2---模块

    模块 你已经学习了如何在你的程序中定义一次函数而重用代码.如果你想要在其他程序中重用很多函数,那么你该如何编写程序呢?你可能已经猜到了,答案是使用模块.模块基本上就是一个包含了所有你定义的函数和变量的 ...

  8. hahah

    ۣۣۖۖۖۖۖۖۖۖۖۖۖۖۖۖۖۖۖۖۖۖۖۖۖۖۖۖۖۖۖۖۖۖۖۖۖۖۖۖۖۖۖۖۖۖۖۖۖۖۖۖۖۖۖۖۖۖۖۖۖۖۖۖۖۖۖۖۖۖۖۖۖۖۖۖۖۖۖۖۖۖۖۖۖۖۖۖۖۖۖۖۖۖۖۖۖۖۖۖ ...

  9. 微信小程序页面-页面跳转失败WAService.js:3 navigateTo:fail url not in app.json

    微信小程序新建页面的要素一是新建的文件名称和其子文件的名称最好一致,不然容易出问题,在小程序页面跳转中如果出现WAService.js:3 navigateTo:fail url not in app ...

  10. linux shell: 取得某个目录下的文件名列表

    取得某个目录下文件名的列表(没有子目录) ls -l dir/ | awk '{print "dir\\" $9}' #其中$9是ls -l 的第9个字段-文件名