标签：rap form 定位 引擎 应用 text out 覆盖 name
javaScript
是web上一种功能强大的编程语言，用于开发交互式的web页面。它不序言进行编译，而是直接侵入在HTML页面中，有浏览器执行
作用：使用js添加页面动画效果，提供用户操作体验，主要应用有：嵌入动态文本于HTML页面、对浏览器事件做出响应、读写HTML元素、验证提交数据、检测访客的浏览信息等。
js本地实际用来向HTML页面添加交互行为
js是一种脚本语言（脚本语言是一种轻量级的编程语言）
js由数行可执行计算机代码组成
js通常被直接嵌入HTML页面
js式一种解释性语言（就是说，代码执行不进行预编译）
js的组成：
核心(ECMAScript）:语法，语句
文档对象模型（DOM）浏览器对象
浏览器对象模型（BOM）操作文档中的元素和内容
js的引入：内嵌式、外链式
内嵌式：通过<script>标签嵌入 <script type = "text/javascript">//javascript代码</script>
外联式：在html文档中，通过<scripe src="">标签引入.js文件，例如：<script src = "1.js" type="text/javascript" charset="utf-8"></script>
基本语法
变量
命名规范：必须以字母或下划线开头，中间式可以是数字、字符或下划线；变量不能包含空格等符号；不能使用js关键字作为变量名；js严格区分大小写
变量声明：var 变量名；//js中变量可以不声明，直接使用，默认值为undefined
变量的赋值：var 变量名=值；//js变量式弱类型，及同一个变量可以存放不同类型的数据
数据类型
undefined，类型只有一个值，即undefined。当声明变量未初始化时，该变量的默认值是undefined
null 只有一个专用值null，表示空，一个占位符。
alert（null==undefined）；//输出“true”，尽管这两个值相等，但他们的含义不同。
boolean，有两个值true和false
Number，表示任意数字
String字符串由双引号或单引号声明
对变量或值调用typeof运算符将返回下列值之一：
undefined - 如果变量式undefined类型的
boolean - 如果变量是boolean类型的
number - 如果变量是number类型的
string - 如果变量是string类型的
object - 变量是一种引用类型或null类型的
基本操作：
元素的输出：
alert（）：向页面中探出一个提示框
innerHTML：向页面中的某个元素中写一段内容，将原有的东西覆盖
document.write（）：向页面中写内容
获取元素内容：
获取元素：document.getElementById("id名称")；
获取元素里面的值： document.getElementById("id名称").value
javascript事件
常用的事件：
onblur 元素失去焦点
onchange 用户改变域的内容
onclick鼠标点击某个对象
ondblclick鼠标双击某个对象
onload某个页面或图像被完成加载
onmousemove鼠标被移动
onmouseout鼠标从某元素移开
onmouseover鼠标被移到某元素之上
onsubmit提交按钮被点击
onfocus/onblur:聚焦离焦事件，用于表单校验的时候比较合适。
onclick/ondblclick:鼠标单击和双击事件
onkeydown/onkeypress：搜索引擎使用较多
onload：页面加载事件，所有的其它操作(匿名方式)都可以放到这个绑定的函数里面去。如果是有名称，那么在html页面中只能写一个。
onmouseover/onmouseout/onmousemove：购物网站商品详情页。
onsubmit：表单提交事件 ，有返回值，控制表单是否提交。
onchange:当用户改变内容的时候使用这个事件(二级联动)
表单提交事件：onsubmit
步骤分析：
一：确定事件（onsubmit）并为其绑定一个函数
二：书写这个函数（获取用户输入的数据<获取数据是需要在制定位置定义一个id>）
三：对用户的数据进行判断
四：数据合法（让表单提交）
五：数据非法（给出错误提示信息，不让表单提交）
如何控制表单提交：关于事件onsubmit:一般用于表单提交的位置，那么需要在定义函数的时候给出一个返回值。onsunmit = return checkForm() 在<sctipt>标签中：function checkForm(){var uvalue = document.getElementById("user").value;if(uvalue==""){alert("用户名为空");return false;}}
表单提交事件代码优化
聚焦事件（onfocus）
离焦事件(onblur)
步骤分析：
一：确定事件（onfocus聚焦事件）并为其绑定一个函数<input type="text" name="user" size="34px" id="user" onfocus="showTips()" onblur="check()"/><span id="userspan"></span>>
二：书写绑定函数（在输入框的后面给出提示信息）在<sctipt>标签中function showTips(){document.getElementById("userspan").innerHTML="<font color=‘gray‘>请输入用户名</font>";}
三：确定时间（onblur离焦事件）并为其绑定一个函数 onblur="check()"具体步骤代码在步骤一中有体现
四：书写函数（对函数进行校验，分别给提示）function check(){var uvalue = document.getElementById("user").value;if(uvalue==""){document.getElementById("userspan").innerHTML="<span color=‘red‘>用户名输入不正确</span>";}else{document.getElementById("userspan").innerHTML="";} }
<span>表示追加
在传参数式不用标明参数的具体类型（如下代码）。
<input type="text" name="user" size="34px" id="user" onfocus="showTips(‘user‘,‘用户名必填！‘)" onblur="check(‘user‘,‘用户名不能为空！‘)"/><span id="userspan"></span>
function showTips(id,info){document.getElementById(id+"span").innerHTML="<font color=‘gray‘>"+info+"</font>";}
function check(id,info){var uValue = document.getElementById(id).value;if(uValue==""){document.getElementById(id+"span").innerHTML="<font color=‘red‘>"+info+"</font>";}else{document.getElementById(id+"span").innerHTML="";}}
标签：rap form 定位 引擎 应用 text out 覆盖 name
原文地址：https://www.cnblogs.com/haowenliang/p/9353175.html
