HTML5+CSS3+JavaScript Web前端开发案例教程课件：背景调色板.pptxVIP

背景调色板

案例介绍技术准备案例实现010203

01案例介绍

案例介绍案例名称：网页背景调色板核心功能：颜色选择器动态设置背景颜色

案例介绍网页背景调色板效果

02技术准备

技术准备技术1：input类型属性HTML的input标签上的type属性用于表示表单输入的类型，在HTML5中新增了input类型的种类有：colordatedatetimedatetime-localemailmonthnumberrangesearchteltimeurlweek

技术准备color类型用在input字段主要用于选取颜色。

技术准备技术2：document对象在HTMLDOM（DocumentObjectModel）中，每一个元素都是一个节点，例如当前的HTML文档就是一个文档节点，所有的HTML元素就是元素节点，甚至连HTML标签上的属性都是属性节点。

技术准备

技术准备document对象获取元素的方法有：方法描述document.getElementsByClassName()返回文档中所有指定类名的元素集合document.getElementById()返回对拥有指定id的第一个对象的引用document.getElementsByName()返回带有指定名称的对象集合document.getElementsByTagName()返回带有指定标签名的对象集合document.images返回对文档中所有Image对象引用document.links返回对文档中所有Area和Link对象引用document.forms返回对文档中所有Form对象引用

03案例实现

案例实现页面结构：

案例实现文件结构：