css及javascript实验_如何实现JavaScript动态加载CSS和JS文件

A. javascript和CSS的区别是什么

在《JavaScript DOM编程艺术》中有这么一段：

各成员的概念与区别一目了然。

但随着nodejs的兴起，V8的炙热，简单地将javascript理解成可提供交互的程序设计语言，难免显得单纯了。

所以，Javascript无所不能（夸张），CSS一技所长！

B. 如何使用JavaScript控制CSS Animations和Transitions

有时候WEB开发人员认为CSS的动画比JavaScript的动画更难理解。虽然CSS动画有其局限性，但它的性能比大多数JavaScript库更加高效，因为它可以借助硬件加速啊！其效果绝对可以超出我们的预期。

CSS animations和transitions再加上点JavaScript就可以实现硬件加速动画，而且其交互效果比大多数JavaScript库更高效。

So，让我们快点开始吧！小伙伴们都等不及了！

注意：Animations(动画)和Transitions(过渡)是不同的

CSS Transitions(过渡)被应用于元素指定的属性变化时，该属性经过一段时间逐渐的过渡到最终需要的值；而CSS Animations(动画)只是在应用时执行之前定义好的操作，它提供更细粒度的控制。

在这篇文章中，我们将分别针对上述内容进行讲解。

控制CSS Transition(过渡)

在编程论坛中，关于transition(过渡)的触发和暂停有无数的疑问。使用JavaScript可以很容易的解决这些疑问。

如何触发元素的transiton(过渡)？切换元素的类名可以触发该元素的transition(过渡)

如何暂停元素的transition(过渡)？在你想要暂停过渡点，用getComputedStyle和getPropertyValue获取该元素相应的CSS属性值，然后设置该元素的对应的CSS属性等于你刚才获取到的CSS属性值。

以下是该方法的一个例子。

<!DOCTYPE html>
<html>
<head>
<title>操作transtition</title>
<style type="text/css">
.box {
margin: 30px;
height: 50px;
width: 50px;
background-color: blue;
}

C. 如何实现JavaScript动态加载CSS和JS文件

项目中需要用到动态加载CSS 文件，整理了一下，顺便融合了动态加载JS 的功能写成了一个对象，先上代码：
var dynamicLoading = {
css: function(path){
if(!path || path.length === 0){
throw new Error('argument "path" is required !');
}
var head = document.getElementsByTagName('head')[0];
var link = document.createElement('link');
link.href = path;
link.rel = 'stylesheet';
link.type = 'text/css';
head.appendChild(link);
},
js: function(path){
if(!path || path.length === 0){
throw new Error('argument "path" is required !');
}
var head = document.getElementsByTagName('head')[0];
var script = document.createElement('script');
script.src = path;
script.type = 'text/javascript';
head.appendChild(script);
}
}
对象包含两个完全独立的方法，分别用来加载CSS 文件和JS 文件，参数均为欲加载的文件路径。原理非常的简单：对于不同的加载文件类型创建不同的节点，然后添加各自的属性，最后扔到head 标签里面。经测试，本方法兼容各浏览器，安全、无毒、环保，是 web 开发人员工作常备代码。
下面是调用代码，异常简单：
//动态加载 CSS 文件
dynamicLoading.css("test.css");
//动态加载 JS 文件
dynamicLoading.js("test.js");

D. HTML CSS JavaScript实战详解的目录

第1篇 HTML网页技术 1
第1章网页技术学前班 2
1.1 Internet相关技术介绍 3
1.1.1 TCP/IP协议 3
1.1.2 IP地址和域名简介 3
1.1.3 URL简介 4
1.1.4 Web浏览器 4
1.2 Internet技术的应用 4
1.3 HTML网页技术简介 5
1.3.1 什么是HTML 5
1.3.2 HTML网页的结构 5
1.3.3 如何获取网页的HTML 6
1.4 静态网页和动态网页 6
1.4.1 有动画的网页就是动态网页吗 6
1.4.2 有了动态网页还有必要学习HTML吗 7
1.4.3 网站简介 8
1.5 小结 8
第2章网页制作的第一次接触 9
2.1 配置Web服务器运行环境 10
2.1.1 系统要求 10
2.1.2 IIS是干什么的 10
2.1.3 安装IIS 10
2.1.4 配置IIS 11
2.1.5 网页制作工具的选择 13
2.2 了解网页技术的工作原理 13
2.2.1 静态HTML的工作流程 14
2.2.2 如何设置Web技术中的访问路径 14
2.2.3 网页中怎么表示颜色 15
2.2.4 学习网页技术的顺序 16
2.3 制作一个完整的HTML网页 17
2.3.1 怎样写HTML网页的标签 17
2.3.2 完成第一个网页 17
2.4 小结 19
第3章 HTML网页的整体设置 20
3.1 HTML的头部信息设置 21
3.1.1 定义网页的标题 21
3.1.2 设置网页的基底网址 22
3.1.3 掌握强大的元信息标签 22
3.1.4 怎样和CSS及JavaScript产生联系 24
3.1.5 头部信息的其他设置 25
3.2 HTML主体的常用设置 26
3.2.1 设置网页的背景色 26
3.2.2 设置网页的背景图片 27
3.3 页面的整体边距 29
3.4 HTML代码的注释 30
3.5 小结 30
第4章 HTML网页中的文字和段落 31
4.1 段落排版和换行 32
4.1.1 给大段文字进行分段 32
4.1.2 给文字加入空格 33
4.1.3 设置文字换行与不换行 33
4.1.4 设置文字对齐方式 34
4.1.5 添加水平分隔线 35
4.2 文字的多样化修饰 37
4.2.1 文字样式设置的基本标签—<font> 37
4.2.2 设置文字的颜色 37
4.2.3 设置文字的尺寸 38
4.2.4 设置文字的字体 39
4.2.5 使文字倾斜 39
4.2.6 使文字加粗 39
4.2.7 给文字加下画线 40
4.2.8 多种标题样式的使用 40
4.2.9 学会处理网页中的特殊字符 41
4.2.10 如何更方便地忽略浏览器对部分HTML的解析 42
4.2.11 其他文字修饰方法 43
4.3 制作滚动文字 44
4.3.1 设置文字滚动 44
4.3.2 设置文字滚动的方向 45
4.3.3 设置文字滚动的速度和形式 45
4.4 用于组织数据的列表 46
4.4.1 列表的结构组成 46
4.4.2 制作无序列表 46
4.4.3 制作有序列表 46
4.5 超级链接 47
4.5.1 给文字添加链接 48
4.5.2 修改链接的窗口打开方式 48
4.5.3 给链接添加提示文字 49
4.5.4 什么是锚（anchor） 49
4.5.5 电子邮件、FTP和Telnet的链接 51
4.6 小结 52
第5章 HTML网页中的图片 53
5.1 认识网页中的图片格式 54
5.1.1 常用的图片格式 54
5.1.2 选择合适的图片格式 55
5.2 插入图片 56
5.2.1 插入图片到网页 56
5.2.2 设置图片的高度和宽度 56
5.2.3 设置图片的边框 57
5.2.4 给图片添加提示文字 57
5.2.5 给图片添加替代文字 58
5.3 图文混合排版 58
5.4 给图片加链接 60
5.5 制作滚动图片 62
5.6 小结 63
第6章插入外部资源 64
6.1 插入多媒体资源 65
6.1.1 为网页添加背景声音 65
6.1.2 为网页添加音乐、动画等更多媒体资源 66
6.2 插入外部程序 67
6.2.1 插入外部JavaScript程序 67
6.2.2 区分程序的客户端程序与服务器端程序 68
6.3 小结 69
第7章强大的表格 70
7.1 认识表格的作用 71
7.1.1 用表格组织数据 71
7.1.2 用表格布局网页 72
7.2 创建一个表格 73
7.2.1 表格的基本构成 73
7.2.2 <tr>与<td>的配合 74
7.2.3 表头组和表尾组的设置 75
7.2.4 创建一个完整的表格 75
7.3 表格的整体控制 76
7.3.1 控制表格的高度和宽度 76
7.3.2 调整表格的水平对齐方式 77
7.3.3 尝试不同类型的表格边框 78
7.3.4 调整表格的填充和间距 82
7.3.5 改变表格的背景色及背景图片 85
7.4 表格行的控制 87
7.4.1 整行的高度设置 87
7.4.2 行内的对齐控制 88
7.5 表格单元格的控制 89
7.5.1 控制单元格的高度和宽度 90
7.5.2 单元格的对齐设置 91
7.5.3 合并多个单元格 91
7.6 表格的互相嵌套 93
7.6.1 嵌套表格的作用 93
7.6.2 表格布局网页实例 94
7.6.3 用Photoshop切片迅速生成布局表格 97
7.7 小结 99
第8章和程序交互的利器——表单 100
8.1 表单的用途及属性 101
8.1.1 表单的用途 101
8.1.2 表单的结构 101
8.1.3 表单的数据传递方式 102
8.2 表单的控件 103
8.2.1 单行文本框控件和密码框控件 103
8.2.2 多行文本框控件 104
8.2.3 不同类型的按钮控件 105
8.2.4 单选框控件和复选框控件 106
8.2.5 下拉列表和列表框控件 107
8.2.6 图像域控件、文件域控件和隐藏域控件 108
8.3 实战表单制作 109
8.3.1 表单控件的分组方法 110
8.3.2 用户注册表单页面实例 111
8.4 小结 113
第9章网页的框架页面 114
9.1 用框架灵活地组织网页 115
9.1.1 框架在网站中的作用 115
9.1.2 框架的结构分析 115
9.2 建立完整的框架页面 116
9.2.1 建立窗口框架集 116
9.2.2 帧的比例调整 117
9.2.3 调整帧边框属性 118
9.2.4 设置帧滚动条 119
9.2.5 复杂帧结构的框架页面 120
9.3 特殊的<iframe>框架 121
9.3.1 使用<iframe>的好处 121
9.3.2 设置浮动框架属性 122
9.4 框架综合实例 123
9.5 小结 125
第2篇 CSS网站布局与样式 126
第10章 CSS的第一次接触 127
10.1 何谓Web标准 128
10.1.1 理解Web标准的基本组成和内涵 128
10.1.2 关于Web标准与浏览器的兼容性 129
10.2 XHTML与CSS的概念 129
10.2.1 XHTML与CSS实现样式与结构分离 129
10.2.2 CSS布局与表格布局的分析 130
10.3 XHTML的基本知识 132
10.4 CSS编写基本模式 133
10.4.1 CSS的声明方法 133
10.4.2 CSS的媒介控制 134
10.5 CSS的基本语法 135
10.5.1 CSS通过接口作用于XHTML元素 135
10.5.2 CSS的属性和选择符 136
10.5.3 CSS的各种选择符详解 137
10.5.4 id和class的区别 139
10.6 CSS的颜色和数值单位 139
10.7 小结 139
第11章 CSS布局方法 140
11.1 什么叫“DIV+CSS” 141
11.1.1 初识div 141
11.1.2 XHTML中的块状元素和内联元素 142
11.1.3 div元素的样式设置 143
11.1.4 布局页面的宽度 144
11.1.5 布局页面水平居中 145
11.1.6 div元素的嵌套 146
11.1.7 div元素的浮动 147
11.1.8 一些高级的div布局技巧 151
11.1.9 一个典型的网页布局实例 153
11.2 列表元素布局 156
11.2.1 列表元素制作导航条 156
11.2.2 列表元素的综合使用——导航条制作 158
11.2.3 导航条的互动布局 159
11.3 CSS盒模型 161
11.3.1 什么是CSS盒模型 161
11.3.2 外边距的控制 162
11.3.3 边框的样式设置 163
11.3.4 内边距的设置 165
11.3.5 盒模型兼容问题 167
11.4 元素的非常规定位方式 167
11.4.1 CSS绝对定位 167
11.4.2 CSS固定定位 170
11.4.3 CSS相对定位 171
11.5 小结 172
第12章 CSS网页元素设计 173
12.1 背景样式控制 174
12.1.1 背景色样式 174
12.1.2 背景图片样式的分类 175
12.1.3 背景图片样式的模拟 175
12.1.4 背景图片的位置 177
12.1.5 固定背景图片 179
12.1.6 背景属性缩写设置 179
12.1.7 背景样式综合示例 181
12.2 超级链接深入应用 184
12.2.1 超级链接伪类的应用实例1 184
12.2.2 超级链接伪类的应用实例2 187
12.3 表单的CSS设计 189
12.4 列表的CSS设计 192
12.4.1 列表演示 192
12.4.2 列表显示技巧 194
12.4.3 使用图片作为列表符号 195
12.5 段落及字体样式设计 198
12.5.1 字体样式的设计 198
12.5.2 字体修饰 199
12.5.3 段落样式的设计 201
12.5.4 设置行距 202
12.5.5 段落内容裁剪 204
12.5.6 纵向段落排版 205
12.6 图片样式控制 207
12.6.1 图片作为超链接 207
12.6.2 漂亮的图文排版 208
12.6.3 技巧图片裁切 211
12.7 CSS滤镜 212
12.7.1 如何使用CSS滤镜 213
12.7.2 CSS滤镜综合实例 215
12.8 小结 217
第13章 CSS编写技巧 218
13.1 CSS设计与编写原则 219
13.1.1 养成好的命名习惯 219
13.1.2 用好id和class 221
13.1.3 提高代码重用率技巧1 222
13.1.4 提高代码重用率技巧2 224
13.1.5 提高代码重用率技巧3 225
13.1.6 CSS属性值的缩写 229
13.2 浏览器解析CSS的兼容问题 230
13.2.1 IE浏览器版本兼容问题的解决办法 230
13.2.2 IE与Firefox之间兼容问题的解决办法 232
13.2.3 IE与Firefox之间兼容问题的解决办法：属性选择符 233
13.2.4 IE与Firefox之间兼容问题的解决办法：子对象选择符 234
13.2.5 IE与Firefox之间兼容问题的解决办法：符号修饰选择符 235
13.3 小结 236
第3篇 JavaScript动态行为 237
第14章 JavaScript的第一次接触 238
14.1 什么是JavaScript 239
14.2 JavaScript有什么功能 239
14.3 在什么地方编写JavaScript 239
14.4 写一个简单的JavaScript程序 240
14.5 小结 241
第15章 JavaScript程序基础知识 242
15.1 JavaScript的基本语法 243
15.1.1 字母大小写编写规范 243
15.1.2 JavaScript代码编写格式 243
15.1.3 注释格式 243
15.1.4 保留字 244
15.1.5 基本的输出方法 244
15.1.6 关于<script></script>标签的声明 246
15.2 JavaScript交互基本方法 246
15.2.1 最常用的信息对话框 246
15.2.2 选择对话框 247
15.2.3 显示提示的对话框 249
15.3 数据类型和变量 250
15.3.1 数据类型的理解 250
15.3.2 学习几种基本数据类型 251
15.3.3 变量的含义 253
15.3.4 变量的声明与使用 253
15.4 常用的运算符 254
15.4.1 运算符与表达式 254
15.4.2 基本算术运算符及使用 256
15.4.3 关系运算符及使用 259
15.4.4 逻辑运算符及使用 261
15.4.5 其他常用运算符及使用 263
15.5 小结 264
第16章 JavaScript程序核心语法 265
16.1 程序的核心：分支和循环 266
16.1.1 if和switch的条件分支 266
16.1.2 while和do…while循环 269
16.1.3 for和for…in循环 272
16.1.4 如何更合理地控制循环语句 274
16.2 函数 278
16.2.1 什么是函数 278
16.2.2 学会使用函数解决问题 279
16.2.3 理解函数的参数传递 280
16.2.4 函数中变量的作用域和返回值 281
16.2.5 函数的嵌套 283
16.3 面向对象编程的简单概念 285
16.3.1 什么是面向对象 285
16.3.2 如何创建对象 286
16.3.3 定义对象的属性 286
16.3.4 对象的构造函数和方法 288
16.3.5 关联数组的概念 290
16.3.6 with语句和for…in语句 292
16.4 小结 294
第17章 JavaScript核心对象 295
17.1 数组对象 296
17.1.1 创建数组 296
17.1.2 数组元素的操作 297
17.1.3 创建多维数组 299
17.1.4 数组的方法 300
17.2 日期对象 306
17.2.1 用Date对象创建常用日期 306
17.2.2 Date日期对象的方法 307
17.2.3 编写一个时间计算程序 311
17.3 数学运算对象 312
17.3.1 数学运算对象的方法和属性 313
17.3.2 做一个小型计算器 315
17.4 字符串对象 317
17.4.1 字符串对象的属性 317
17.4.2 字符串对象的方法 318
17.5 函数对象 322
17.6 小结 324
第18章浏览器对象模型 325
18.1 navigator浏览器信息对象 326
18.1.1 navigator对象的管理方法 326
18.1.2 在网页上显示浏览者系统的基本信息 326
18.2 window对象 328
18.2.1 window对象的管理方法 328
18.2.2 制作可定制的弹出窗口 329
18.2.3 完美地关闭窗口 331
18.2.4 制作简单网页动画 332
18.2.5 延时执行命令 334
18.3 location对象 336
18.4 history对象 338
18.5 screen对象 339
18.6 小结 341
第19章文档对象模型 342
19.1 文档对象模型概念详解 343
19.1.1 文档对象模型简介 343
19.1.2 文档对象的属性 343
19.1.3 文档对象的方法 345
19.2 forms对象 347
19.2.1 访问表单对象的方法 347
19.2.2 表单控件 350
19.2.3 制作数据检测功能的注册页面 357
19.3 image对象 361
19.4 链接对象 364
19.5 小结 366
第20章事件响应 367
20.1 事件响应编程的概念 368
20.1.1 事件和事件处理程序 368
20.1.2 HTML元素常用事件的展示 368
20.2 事件方法的使用 370
20.3 event对象 372
20.3.1 event对象的各种属性 372
20.3.2 网页监视发生事件的元素 373
20.3.3 网页检测用户的鼠标信息 374
20.3.4 网页检测用户的键盘按键信息 376
20.3.5 鼠标随意拖动网页元素 378
20.4 事件编程访问网页元素 380
20.4.1 数组方式访问 380
20.4.2 id名称和name名称访问 382
20.4.3 HTML标签名称访问 383
20.4.4 DOM节点方法访问 385
20.5 结合CSS制作动态页面 387
20.5.1 让HTML元素动起来 388
20.5.2 通过切换CSS给网页换肤 390
20.5.3 动态添加节点 392
20.6 小结 395
第21章 JavaScript综合范例 396
21.1 流行的应用：JavaScript选项卡切换内容块 397
21.1.1 思路分析 397
21.1.2 编写内容容器切换程序 398
21.1.3 选项卡切换实例功能编写 398
21.1.4 选项卡切换实例美化 400
21.2 仿猫扑：网页框架伸缩 404
21.2.1 思路分析 404
21.2.2 分析JavaScript的框架操作 405
21.2.3 框架伸缩实例功能编写 406
21.2.4 框架伸缩实例美化 408
21.3 实用多级导航条 412
21.3.1 思路分析 413
21.3.2 CSS二级导航条实例功能编写 413
21.3.3 完善CSS二级导航条实例 415
21.3.4 JavaScript制作导航条 417
21.4 各种对联广告的制作 420
21.4.1 分析对联广告如何适应不同分辨率屏幕 420
21.4.2 分析对联广告如何关闭 422
21.4.3 固定位置的对联广告 425
21.4.4 移动的对联广告 428
21.5 HTML元素伸缩效果的制作 431
21.5.1 制作进度条 431
21.5.2 制作可伸缩的菜单组 433
21.6 小结 435
第4篇网页制作综合实例 436
第22章制作个人网站 437
22.1 网站整体规划 438
22.1.1 网站结构规划 438
22.1.2 页面功能划分 438
22.1.3 页面内容结构布局 439
22.2 页面设计效果图 439
22.3 站点目录规划 440
22.3.1 规划各种资源目录 440
22.3.2 配置IIS虚拟目录 441
22.4 构建XHTML结构并用CSS布局 442
22.5 参照最终效果图美化页面样式 446
22.5.1 输入所有的标题和内容 446
22.5.2 用CSS设置背景图片 451
22.5.3 用CSS设置渐变背景 451
22.5.4 用CSS设置页面垂直滚动条样式 452
22.6 首页添加动态行为 453
22.7 制作日志页面 458
22.7.1 日志浏览功能思路分析 458
22.7.2 日志代码编写 459
22.8 制作相册页面 462
22.8.1 相册浏览功能思路分析 463
22.8.2 相册代码编写 463
22.9 注册域名并发布网站 467
22.10 小结 468
第23章制作门户网站 469
23.1 门户网站整体规划 470
23.1.1 规划门户网站结构 470
23.1.2 规划页面功能结构 470
23.1.3 首页内容结构布局 470
23.2 页面设计效果图 471
23.3 站点目录规划 472
23.4 构建XHTML结构并用CSS布局 472
23.5 参照最终效果图美化页面样式 478
23.5.1 输入所有的标题和内容 478
23.5.2 设置页面主体背景 478
23.5.3 设置页面渐变背景 479
23.5.4 设置有规律的背景图片 479
23.6 插入无虚框的Flash动画 480
23.7 JavaScript与Flash制作轮换图片 482
23.8 制作栏目页面 488
23.9 制作文章页面 492
23.10 注册域名并发布门户网站 495
23.11 小结 496
附录A HTML标记参考 497
附录B CSS属性列表 503
附录C JavaScript属性及方法列表 506

E. 在html语言中引入CSS代码和Javascript代码的方法

你可以定义“选择符”来间接的作用于html元素，这里的“选择符”包括自定义的class和id，还可以直接是html标签，比如p，div，td…在HTML中插入JS可以用脚本源代码将放入其间。
也可以通过属性Language="JavaScript"说明标识！谢谢采纳！

F. 关于CSS和JavaScript

CSS和JavaScript是制作网页常用到的两种语言，不属于Dreamweaver，Dreamweaver只是制作网页的一种工具，做网页可以使用CSS和JavaScript也可以不使用，也就是说用Dreamweaver可以使用CSS和JavaScript也可以不使用。

因为Dreamweaver是一款非常好的网页制作工具，在使用CSS和JavaScript上有许多便捷的功能，比起直接用记事本编写语言要方便，这是Dreamweaver的特色之一，要想熟练使用Dreamweaver，就必须要了解这些快捷功能，所以Dreamweaver基础课程都要讲到这些。

G. 基于html JavaScript CSS做一个onMouseOver事件，当鼠标在上面时下面的隐藏栏会出现，里面有一些超链接

楼主没有完全表述清楚到底是做一个菜单,还是一个选项卡切换,看了半天,大概是你想写一个导航菜单了,抽空写了一个,先给出全部源码:

<!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=gb2312" />
<title>导航菜单</title>
<style type="text/css">
body{font-size:12px;}
ul,li{list-style-type:none;padding:0;margin:0;}
.main_nav{padding:2px;}
.main_nav a{display:block;line-height:28px;height:28px;padding-left:10px;overflow:hidden;}
.main_nav .navs{width:120px;}
.main_nav .navs .nav_a{background:#DDDDDD;color:#000000;text-decoration:none;}
.sub_nav{display:none;width:120px;}
.sub_nav li a {color:#FFFFFF;text-decoration:none;}
.sub_nav li a:link, .sub_nav li a:visited{background:#A0BED5;}
.sub_nav li a:hover{background:#0077BB;}
</style>
</head>
<body>
<ul class="main_nav">
<li class="navs" onmouseover="showSubNav('subNav_1');" onmouseout="hideSubNav('subNav_1');">
<a href="javascript:;" class="nav_a">我的个人信息</a>
<ul id="subNav_1" class="sub_nav">
<li><a href="#">姓名</a></li>
<li><a href="#">个人主页</a></li>
<li><a href="#">我的校内</a></li>
<li><a href="#">我的空间</a></li>
</ul>
</li>
</ul>
<script language="javascript" type="text/javascript">
function showSubNav(id){
document.getElementById(id).style.display='block';
}
function hideSubNav(id){
document.getElementById(id).style.display='none';
}
</script>
</body>
</html>

先复制下来,另存为x.htm 在浏览器打开运行一下吧, 鼠标放到 "我的个人信息" 会弹出一个下拉菜单, 鼠标放到下面的子菜单可以导航了,不会出现菜单忽然失踪了,测试浏览器(Firefox3,Opera 9.6, IE6,7,8),根据自己需要再改写吧,上面的可以说是最基本的导航菜单模型,
不过,推荐楼主用菜单生成器生成,兼容性好,有不用写代码.网上搜索一下就有了.

为什么上面的鼠标放在子菜单下,子菜单并没有消失?因为鼠标放到子菜单上面, 由于子菜单包含在<li class="navs" 这个标签内,所以,一样会触发 onmouseover 事件,而显示子菜单,当鼠标移出后,隐藏,

如果把 <ul id="subNav_1" class="sub_nav">
<li><a href="#">姓名</a></li>
<li><a href="#">个人主页</a></li>
<li><a href="#">我的校内</a></li>
<li><a href="#">我的空间</a></li>
</ul> 这段子菜单代码放到上面的 <li class="navs" 这个标签外,
那么,就会出现你上述的情况,鼠标来不及点击子菜单,子菜单就消失了,
不知道你明白了没有?

H. javascript 脚本如何控制CSS样式

点击哪个第一项？公司简介？
/*js
<script>
function removecss(a){
document.getElementById(a).className="";
}
</script>

div id="left_navigation">
<ul>
<li onclick="removecss('aa')" > <a href="#">公司简介</a></li>
<li > <a href="#">公司动态</a></li>
<li > <a href="#">产品和服务</a></li>
<li > <a href="#">合作伙伴</a></li>
<li class="nonce" id="aa"> <a href="#">团队建设</a></li>
<li > <a href="#">诚聘英才</a></li>
<li > <a href="#">法律声明</a></li>
<li > <a href="#">友情链接</a></li>
<li > <a href="#">联系我们</a></li>
</ul>
</div>

I. Javascrip 调用 CSS问题

<html>
<head>
<title>无标题文档</title>
<style type="text/css">
div{border:#000000 1px solid;width:100px; height:100px}
.css1{background-color:#999999}
.css2{background-color:#006600}
</style>
<script type="text/javascript">
function x(){
var z = document.getElementById('d').className;
if(z == 'css1'){
document.getElementById('d').className = 'css2';
}else {
document.getElementById('d').className = 'css1';
}
}
</script>
</head>
<body>
<div class="css1" id="d" onclick="x()">xxx</div>
</body>
</html>

J. 网页设计与开发——HTML、CSS、JavaScript的第十章课后习题的最后一题答案

好的，等会哈。

导航:首页 > 编程语言 > css及javascript实验

css及javascript实验

与css及javascript实验相关的资料

友情链接