JavaScript 实例

基础 JavaScript 实例

• 用JavaScript输出文本
• 用JavaScript改变HTML元素
• 一个外部JavaScript
• 实例解析

JavaScript 语句、注释和代码块

• JavaScript 语句
• JavaScript 代码块
• JavaScript 单行注释
• JavaScript 多行注释
• 使用单行注释来防止执行
• 使用多行注释来防止执行
• 实例解析

JavaScript 变量

• 声明一个变量，为它赋值，然后显示出来


• 实例解析

JavaScript 条件语句 If ... Else

• If 语句
• If...else 语句
• 随机链接
• Switch 语句
• 实例解析

JavaScript 消息框

• Alert(警告)框
• 带有换行的警告框
• 确认框
• 提示框
• 实例解析

JavaScript 函数

• 函数
• 带有参数的函数
• 带有参数的函数 2
• 返回值的函数
• 带有参数并返回值的函数
• 实例解析

JavaScript 循环

• For 循环
• 循环输出 HTML 标题
• While 循环
• Do while 循环
• break 语句
• continue 语句
• 使用 For...In 声明来遍历数组内的元素


• 实例解析

JavaScript 事件

• onclick事件
• onmouseover 事件
• 实例解析

JavaScript 错误处理

• try...catch 语句
• 带有确认框的 try...catch 语句
• onerror 事件
• 实例解析

高级 JavaScript 实例

• 创建一个欢迎 cookie
• 简单的计时
• 另一个简单的计时
• 在一个无穷循环中的计时事件
• 带有停止按钮的无穷循环中的计时事件
• 使用计时事件制作的钟表
• 创建对象的实例
• 创建用于对象的模板

JavaScript 应用实例

• javascript 幻灯片代码(含自动播放)
• CSS 日历样式
• JavaScript 弹窗
• JavaScript 图片弹窗
• JavaScript Lightbox
• javascript 搜索框自动提示
• JavaScript 表格数据搜索
• JavaScript 实现列表按字母排序
• JavaScript 实现表格单列按字母排序
• JavaScript 动画应用实例
• JavaScript 进度条实例
• JavaScript 百分比进度条
• JavaScript/CSS 实现提示弹窗
• JavaScript/CSS 实现待办事项列表(To Do List)
• HTML CSS, JavaScript 计算器
• HTML、CSS、JavaScript 实现下拉菜单效果
• JS/CSS 各种操作信息提示效果
• JS/CSS 在屏幕底部弹出消息(snackbar)
• JS/CSS 登录表单
• JS/CSS 注册表单
• JavaScript 计算器(倒计时)
• JS/CSS 菜单按钮切换(打开/关闭)
• JS/CSS 手风琴动画效果
• JS/CSS 带图标手风琴动画效果
• JS/CSS 选项卡
• JS/CSS 选项卡 – 淡入效果
• JS/CSS 选项卡 – 设置默认选项
• JS/CSS 选项卡 – 设置关闭按钮
• JS/CSS 选项卡 – 垂直方向
• JS/CSS 选项卡 – 幻灯片效果
• JS/CSS 响应式顶部导航样式实例
• JS/CSS 侧边栏动画实例
• JS/CSS 侧边栏动画实例 - 页面主体内容向右移动
• JS/CSS 侧边栏动画实例 - 页面主体内容黑色透明背景
• JS/CSS 全屏幕侧边栏
• JS/CSS 侧边栏 - 无动画效果
• JS/CSS 右侧侧边栏
• JS/CSS 全屏幕导航 – 从上到下动画
• JS/CSS 点击式下拉菜单
• JS/CSS 点击式下拉菜单 - 右对齐
• JS/CSS 点击式导航栏下拉菜单
• JS/CSS 下拉菜单可进行搜索/过滤操作
• JS 联想、自动补齐功能
• JavaScript 按下回车(Enter)键触发按钮点击事件
• JavaScript 创建一个菜单搜索
• Javascript 判断是移动端浏览器还是 PC 端浏览器
• JavaScript 判断是否微信浏览器
• JavaScript/CSS 列表搜索功能
• JavaScript/CSS 表格搜索功能
• JavaScript/CSS 下拉菜单搜索功能
• JavaScript/CSS 列表排序功能
• JavaScript/CSS 表格排序功能