1.表单元素
1.input元素
?1.隐藏域和文件选项框
???1.隐藏域
?????<input type="hidden">
?????要提交给服务器的数据，但是不想展示给用户看可以放在隐藏域中。
???2.文件选择框
?????<input type="file">
?????注意：
?????1.method属性的值必须为post
?????2.enctype属性的值必须为multipart/form-data
2.textarea元素
?1.作用
???允许输入多行数据的文本框。
?2.语法
???标记：<textarea></textarea>
???属性：
???????name:定义控件名称，提供服务器使用
readonly:只读，无值的属性
cols:指定文本域的列数，即一行能显示多少英文字符（中文字符减半）
rows:指定文本域的行数，即默认显示多少行数据，超出rows的话会出现滚动条。
3.select元素
?1.语法
????1.<select></select>
??????作用：在页面中表示一个选项框
????2.<option></option>
?????作用：表示选项
?2.属性
???1.select属性
?????1.name 定义选项框的名称
?????2.size 定义默认显示选项的数量，默认值为1
?????3.multiple 设置多选，无值属性
????????????????只有滚动列表支持多选。
???2.option属性
?????1.value 定义选项的值
?????2.selected 设置默认选中项，无值属性
4.其它元素
?1.label元素
???作用：关联表单控件的文本
???标记：<label></label>
???属性：for
?????????设置要与该元素关联的表单控件的id值
?2.为控件分组
???<fieldset></fieldset> 为控件分组
???<legend></legend> 为分组指定标题
?3.浮动框架
???作用：允许在一个网页中，再引入其他的网页
???语法：<iframe></iframe>
???属性：
?????1.src 要引入的网页路径（url）
?????2.frameborder 浮动框架的边框，默认值1
?????3.width 宽度
?????4.height 高度
???练习：
?????新建footer.html网页，在网页中写上版权说明，在index.html网页中通过iframe引入footer.html。
2.新表单元素
?1.什么是新表单元素
???在HTML5版本中新提出来的控件。
?2.详解
???1.电子邮件类型
?????<input type="email">
?????作用：表单在提交时，会验证数据是否符合email的规范(@)
???2.搜索类型
?????<input type="search">
?????作用：提供了快速清除功能
???3.url类型
?????<input type="url">
?????作用：提交时，验证数据是否符合url的规范（绝对路径的规范）
???4.电话号码类型
?????<input type="tel">
?????作用：在移动端设置中，显示“拨号键盘”
???5.数字类型
?????<input type="number">
?????作用：只能接收数字，并可以灵活调整数字的值
?????属性：
????????value:控制的值
min:能够接收的最小值
max:能够接收的最大值
step:每次调整数字时的变化范围
???6.范围类型
?????<input type="range">
?????作用：提供一个滑块组件，允许用户选取指定范围的值。
?????属性：
????????value:控制的值，默认值。
min:能够接收的最小值
max:能够接收的最大值
step:范围的步长
???7.颜色类型
?????<input type="color">
?????作用：提供一个颜色拾取控件
???8.日期类型
?????<input type="date">
?????作用：提供一个日期选择控件
???9.周类型
?????<input type="week">
???10.月份类型
?????<input type="month">
3.JavaScript概述
?1.什么是javascript?
???JavaScript，简称js,是一种运行于js解释器/引擎中脚本语言。
???运行环境：
??????1.独立安装的js解释器(node)
??????2.嵌入在浏览器内核中的js解释器
?2.js的发展史
???1.1992年Nombas公司为自己的软件开发了一款脚本语言ScriptEase,可以运行在浏览器中。
???2.1995年网景开发了另一款脚本语言LiveScript,后期更名为JavaScript
???3.1996年Microsoft在IE3.0版本克隆版本JSscript
???4.1997年提交给ECMA(欧洲计算机制造商联合会)，定义了ECMAScript(ES5,ES6)
?3.JS的组成
???由以下三部分组成：
???1.核心 (ECMAScript)
???2.DOM(Document Object Model)
?????文档对象模型
?????提供了一组允许操作页面元素的函数和属性。
???3.BOM(Browser Object Model)
?????浏览器对象模型
?????提供了一组允许操作浏览器的函数和属性。
?4.js的特点
???1.语法类似于c,java
???2.无需编译，由js解释器直接运行
???3.弱类型语言
???4.面向对象的
4.JavaScript的基础语法
?1.使用js
???1.运行环境搭建
?????1.独立安装js解释器（node）
???????1.在命令行界面输入node 按回车键
2.输入console.log("打印输出的内容");
?????2.使用浏览器内核嵌入js的解释器
???????浏览器内核负责内容的渲染由两部分组成：
??1.内容排版引擎-解析HTML和CSS
??2.脚本解释引擎-解析javascript
1.直接在浏览器中输入js脚本
??console.log();
2.将JS脚本嵌入在HTML页面中执行
?1.HTML的元素的事件执行js脚本
???事件：onclick-鼠标单击时要执行的操作
???ex:
???<input type="button" value="你点我试试？" onclick="console.log(‘点你咋地？！‘)">
?2.在<script>标记中编写脚本并执行
???网页的任意位置处，嵌入一对<script></script>标记，
???在<script>中编写js代码。
???js的输出方式：
?????控制台输出：console.log();
?????弹出框输出：alert();
?????网页中输出：document.write();
?????
?????????3.使用外部脚本文件(.js为后缀)
???1.创建脚本文件
???2.在文件中编写js脚本
???3.在使用的网页中引入
?????<script src="js文件的路径">
????????//引入外部的js文件后，这对scirpt标记中不能再写js脚本
?????</script>
JS基础-表单元素-新表单元素-js概述
原文地址：https://www.cnblogs.com/QiliPING9/p/9027850.html