12】、调试
为什么要去调试?
1.在编写JavaScript时,如果没有调试工具将是一件很痛苦的事情。
2.没有调试工具是很难去编写JavaScript程序的。
3.编写的代码可能包含语法错误、逻辑错误,如果不借助调试工具,这些错误很难去发现
4.帮助找到错误信息的位置

通常,在编写一个新的JavaScript代码过程中都会发生错误

代码调试:在程序代码中寻找错误

console.log()
我用的chrome浏览器[控制台console等]进行调试,因为chrome的开发者工具是最好的前端调试工具
debugger 关键字用于停止执行 JavaScript,并调用调试函数。
这个关键字与在调试工具中设置断点的效果是一样的。

13】、表单验证

 <form action="">
邮箱:<input id="email" type="text"/>
<input id="submit" type="button" value="submit" />
</form> <p style="color: red;" id="result"></p>
 /**
验证email
并非符合实际开发需要
*/ function $(id) {
return document.getElementById(id);
} var email = $('email');
var result = $('result');
var submit = $('submit'); email.addEventListener('keyup', function () {
if(email.value.indexOf('@') > 0) {
result.innerHTML = '';
}else if(email.value.indexOf('@') < 0) {
result.innerHTML = '请输入正确的邮箱格式,包括@';
}
}, false); submit.addEventListener('click', function () {
if(email.value == null || email.value == ''){
result.innerHTML = '邮箱不得为空';
}else {
//判断长度,不小于6位
if(email.value.length < 6){
result.innerHTML = '邮箱不得小于6位';
}
}
}, false);

(七)JavaScript之[调试]与[前端表单验证]的更多相关文章

  1. jQuery/javascript实现网页注册的表单验证

    <html> <head> <meta charset="utf-8"> <title>注册表单验证</title> & ...

  2. jQuery简单前端表单验证

    <!DOCTYPE html> <html> <head> <title>表单验证</title> <script src=" ...

  3. 前端表单验证常用的15个JS正则表达式

    在表单验证中,使用正则表达式来验证正确与否是一个很频繁的操作,本文收集整理了15个常用的javaScript正则表达式,其中包括用户名.密码强度.整数.数字.电子邮件地址(Email).手机号码.身份 ...

  4. 最常用的15个前端表单验证JS正则表达式

    在表单验证中,使用正则表达式来验证正确与否是一个很频繁的操作,本文收集整理了15个常用的JavaScript正则表达式,其中包括用户名.密码强度.整数.数字.电子邮件地址(Email).手机号码.身份 ...

  5. JavaScript入门学习笔记(表单验证)

    表单验证: 在数据被送到服务器之前对HTML表单中的输入数据进行验证,避免服务器频繁验证信息造成用户体验差. (1)表单数据是否为空 (2)输入的信息格式是否正确 (3)输入数据的类型是否正确 必填( ...

  6. Web前端表单验证

    表单选择器 :input(匹配所有input.textarea.select和button元素)   :text(匹配所有单行文本框)   :password(匹配所有密码框)   :radio(匹配 ...

  7. 4.前端注册表单验证 && 表单回填

    表单验证 前端表单验证就是在 jsp 页面中添加验证逻辑,使得注册表单在传入后台之前先进行一次表单验证 在jsp文件里的 head 块里面添加 jQuery 代码 <script type=&q ...

  8. Angular自定义表单验证

    前端表单验证 为年龄输入框添加了两个验证,并分情况填写了提示语 <form nz-form [formGroup]="validateForm"> <nz-for ...

  9. 仿照easy-ui并改进的表单验证

    概述 easy-ui有自身的一套表单验证,扩展方便,但默认下也存在一些弱点,比如多规则验证.后台验证.远程异步验证等,这些功能要解决起来是比较吃力的.我仿照它的样式,写了一套前端表单验证的validB ...

随机推荐

  1. ConcurrentHashMap原理详解

    参考链接:https://www.cnblogs.com/chengxiao/p/6842045.html https://www.cnblogs.com/ITtangtang/p/3948786.h ...

  2. php 生成读取csv文件并解决中文乱码

    csv其实是文本文件,但是里面的内容是利用逗号分隔的. 1. 生成csv文件 function new_csv($arr) { $string=""; foreach ($arr ...

  3. Windows10下设置Shift+右键增加cmd

    https://blog.csdn.net/wyx0712/article/details/82120806

  4. 复制虚拟机出现”适配器 的mac地址在保留地址范围内‘’

    首先我的虚拟机是复制出来的,选择我已经移到,但是结果会出现了以下情况,导致了我无法ping 通,先看下提示: 使用:ipconfig –all 命令查寻,果然再现有打开的虚拟机中,存在两个mac地址相 ...

  5. python练习六十四:EXCEL文件处理

    假设要读取number.txt文件中内容,code.txt文件内容如下 [ [1,2,3], [4,5,6], [7,8,9] ] 数据写入表格,如图 写文件(如果有文件,那直接调用就行,我这里自己先 ...

  6. C++: int int& int * int**的区别、联系和用途

    1.int; int是C++关键字,表示整型,其大小是32位有符号整型,表示的范围是-2,147,483,648 到 2,147,483,647:在声明和定义变量时使用,它表示的意思是所声明或所定义的 ...

  7. thinkPHP5.0验证码不显示

    1.使用composer安装时,验证码无法正常显示 主要是因为验证码扩展库的版本安装不正常,官方的5.0版本的扩展库版本号都是1.*,默认安装的是2.0版本,2.0版本均为ThinkPHP5.1版本专 ...

  8. 一些自己编写的简单的js

    图片在窗口内弹来弹去的效果 <div class="FrontAdv_float01-default" style="position: absolute;z-in ...

  9. 07-----nodejs 中 npm的使用

    npm是什么? 简单的说,npm就是JavaScript的包管理工具.类似Java语法中的maven,gradle,python中的pip. 安装 傻瓜式的安装. 第一步:打开https://node ...

  10. app的deviceName,apppackage,appactivity获取

    deviceName值的获取: deviceName=192.168.137.150:5555 ip:手机ip地址,端口,通过如下命令开启 # adb devices //查看当前连接设备 # adb ...