Web测试和前端技术
Html
Form表单
用户需要输入内容的地方一般有一个表单元素
method:GET/POST
action:要打开/提交的目文件
Table表格
检查表格数据和数据库的一致性
表格的布局检测:填满一条数据检查表格有没有错位:GUI检测
表格的每个字段有排序功能:点一下升序再点一下降序,默认不排序或按照id降序
表格有翻页功能:总数、每行页数、当前页数、总页数、跳转到x页、首页、上页、下页、尾页
翻页和排序要联合测试,还要结合新增和删除一起测试
a超链接元素
链接文字正确性
链接目标地址是否正确是否打开新页面
自动化连接测试工具xenu
input输入框
单行文本型
理论上允许输入所有类型字符(前后一般不能有空格,中间空格等要看需求)但某些有字符类型要求,如用户名
长度检查:最小、最大、最小减一、最大加一
特殊字符测试:' " \ < > #%_等等
数字型输入框
数字有效性检查:一定是一个有效的数字或带小数点,100/-100/100.555/.555
长度检查:整数部分、小数部分
特殊字符检查:负号、其他特殊字符(多于一个的小数点、千位符)
金额字段直接检查字段类型是否为Decimal,MySQL金额字段只能用Decimal类型,float会丢失精度
用float 二进制存储小数,十进制转二进制除不尽,会丢失精度
用decimal用字符存储
日期型输入框
有效的年1900-9999
月:1-12
日:1-28,29,30,31
闰年润月
日期的有效形式
yyyy-mm-dd HH:MM:SS | yyyy/mm/dd | yyyy.mm.dd
textarea多文本域
检查保存的格式是否正确、缩进换行等
如果是复杂的编辑控件,富文本编辑框(Rich Text)
编程语言提供引用的库类
开发自己写的or抄的:严格测试
radio单选框
一般会有默认值
只能选一个,一定要选一个
可选项应包括所有可能性
checkbox复选框
可以多选
可以不选可选项不一定要包含所有可能
select下拉列表
可以单选,可以多选
不选的时候需要加入一个空项
可以有默认值,有可以没有
有些是可以编辑的,比较少,比如淘宝搜索热词推荐
外键约束检查
button按钮
通常验证按钮文字和行为
按钮连续点击
在可以连续添加的地方,点击按钮后要置灰(不可点击)
默认按钮(易用性)登录,搜索,提交设置为默认,不能将取消设为默认
上传控件
只能上传指定类型的文件(根据文件名后缀)
上传文件的大小要有限制一般<2M,足够了
一般不能上传执行文件(*.exe)和脚本文件(*.vbs(windows);*.sh(linux脚本);.bat(windows脚本)
CSS
层叠样式表
CSS Casecade Style Sheet
CSS是一块块的样式描述;在元素中用class=样式名 调用
需要检测不同浏览器对CSS的样式要求不同
JavaScript
是从服务器传输过来的可以在浏览器中运行的代码,他在浏览器中是万能的
JavaScript一定只能运行在客户端浏览器中
尽量多的采用JS代码,可以减轻服务器的压力
Ajax
异步刷新或局部刷新
AJAX 不是新的编程语言,而是一种使用现有标准的新方法。
AJAX 是与服务器交换数据并更新部分网页的艺术,在不重新加载整个页面的情况下。
jQUERY
jQuery 是一个 JavaScript 库。
jQuery 极大地简化了 JavaScript 编程。
前端技术的三层
结构层
表示层
行为层
Web测试和前端技术的更多相关文章
- 关于当前Web前端技术的一些感悟和笔记
最近这些年,随着前端应用技术突飞猛进,产生了很多新的前端框架,当然也引入了数不胜数的前端技术概念,前端不在是早期Web Form的拖拉处理方式,也不再是Ajax+HTML那么简单,随着前端技术的发展, ...
- web前端技术体系大全
一.前端技术框架 1.Vue.js 官网:https://cn.vuejs.org/ Vue CLI:https://cli.vuejs.org/ 菜鸟教程:http://www.runoob.com ...
- 绝版珍珍藏:web前端技术学习指南
绝版珍珍藏:web前端技术学习指南 优秀的Web前端开发工程师要在知识体系上既要有广度和深度!应该具备快速学习能力. 前端开发工程师不仅要掌握基本的Web前端开发技术,网站性能优化.SEO和服务器端的 ...
- 20151028整理罗列某种开发所包括对技术(技术栈),“较为全面”地表述各种技术大系的图表:系统开发技术栈图、Web前端技术栈图、数据库技术栈图、.NET技术栈图
———————————— 我的软件开发生涯 (10年开发经验总结和爆栈人生) 爆栈人生 现在流行说全栈.每种开发都有其相关的技术.您是否觉得难以罗列某种开发所包括对技术(技术栈)呢? 您是否想过: ...
- Web前端技术体系大全搜索
一.前端技术框架 1.Vue.js 官网:https://cn.vuejs.org/ Vue CLI:https://cli.vuejs.org/ 菜鸟教程:http://www.runoob.com ...
- 当下较热web前端技术汇总
Web前段技术发展很快,主流技术日新月异,想想自己刚毕业那会用的asp技术,现在已经很少有主流网站在使用了.再到后来的J2EE框架,然后SpringMVC大行其道,但是最近各种js框架被广为传播,Ht ...
- 最受欢迎web前端技术总结
Web前端技术发展非常快,主流技术的进步.想想刚毕业那会用asp技术.目前,该网站已经非常少见主流应用. 后来的后来J2EE框架.然后SpringMVC声望,然而,最近的各种js框架广泛传播,Html ...
- 转:Web 测试的创作与调试技术
摘要:学习有关 Visual Studio 2005 Web 测试的更多知识,包括 Web 测试引擎和记录器如何工作,以及如何创建有效的 Web 测试. 本页内容 读者 简介 记录一个 Web 测试 ...
- web前端(2)—— 前端技术介绍
前端技术 前文了解了什么是前端,那么前端技术到底有哪些呢?最核心的就这三个: html/html5 css/css3 javascript 什么是HTML HyperText Markup Langu ...
随机推荐
- Python编写的桌面图形界面程序实现更新检测和下载安装
在Python中我们有很多种方案来编写桌面图形用户界面程序,譬如内置的 Tkinter .强大的 PyQt5 和 PySide2 ,还有 wxPython .借助这些或内置或第三方的模块,我们可以轻松 ...
- 自动发布-asp.net自动发布、IIS站点自动发布(集成SLB、配置管理、Jenkins)
PS:概要.背景.结语都是日常“装X”,可以跳过直接看自动发布 环境:阿里云SLB.阿里云ECS.IIS7.0.Jenkins.Spring.Net 概要 公司一个项目从无到有,不仅仅是系统从无到有的 ...
- 极简 Node.js 入门 - 1.4 NPM & package.json
极简 Node.js 入门系列教程:https://www.yuque.com/sunluyong/node 本文更佳阅读体验:https://www.yuque.com/sunluyong/node ...
- 文件上传Upload 学习笔记
整理完自己还有点晕,看来还是得找点靶场自己练习练习Orz 1:客户端JavaScript校验 Burp改包即可 2:服务端对Content-Type进行校验 猜测后,修改对应Content-Type字 ...
- JVM初探(五):类的实例化
一.概述 我们知道,一个对象在可以被使用之前必须要被正确地实例化.而实例化实际指的就是以一个java类为模板创建对象/实例的过程.比如说常见的 Person = new Person()代码就是一个将 ...
- CSS 学习第一天
css的三种引入方式: 1.内嵌:直接在标签中添加style属性 格式:<标签名 style="样式1:样式值1:样式2:样式值2"> 2.内联:在head标签中添加& ...
- Vue Slots
子组件vue <template> <div> <slot v-if="slots.header" name="header"&g ...
- 金题大战Vol.0 A、凉宫春日的叹息
金题大战Vol.0 A.凉宫春日的叹息 题目描述 给定一个数组,将其所有子区间的和从小到大排序,求第 \(k\) 小的是多少. 输入格式 第一行两个数\(n\),$ k\(,表示数组的长度和\)k$: ...
- Javascript之其实我觉得原型链没有难的那么夸张!
原型链.闭包.事件循环等,可以说是js中比较复杂的知识了,复杂的不是因为它的概念,而是因为它们本身都涉及到很多的知识体系.所以很难串联起来,有一个完整的思路.我最近想把js中有点意思的知识都总结整理一 ...
- Markdown实验样例
一级标题 二级标题 三级标题 重新开始一个段落 这是新的段落 斜体文本 粗体文本 粗斜体文本 下面是分隔线 删除线 下划线 脚注[1] 无序列表 第一项 嵌套元素1 嵌套元素2 第二项 嵌套元素1 嵌 ...