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测试和前端技术的更多相关文章

  1. 关于当前Web前端技术的一些感悟和笔记

    最近这些年,随着前端应用技术突飞猛进,产生了很多新的前端框架,当然也引入了数不胜数的前端技术概念,前端不在是早期Web Form的拖拉处理方式,也不再是Ajax+HTML那么简单,随着前端技术的发展, ...

  2. web前端技术体系大全

    一.前端技术框架 1.Vue.js 官网:https://cn.vuejs.org/ Vue CLI:https://cli.vuejs.org/ 菜鸟教程:http://www.runoob.com ...

  3. 绝版珍珍藏:web前端技术学习指南

    绝版珍珍藏:web前端技术学习指南 优秀的Web前端开发工程师要在知识体系上既要有广度和深度!应该具备快速学习能力. 前端开发工程师不仅要掌握基本的Web前端开发技术,网站性能优化.SEO和服务器端的 ...

  4. 20151028整理罗列某种开发所包括对技术(技术栈),“较为全面”地表述各种技术大系的图表:系统开发技术栈图、Web前端技术栈图、数据库技术栈图、.NET技术栈图

    ———————————— 我的软件开发生涯 (10年开发经验总结和爆栈人生) 爆栈人生 现在流行说全栈.每种开发都有其相关的技术.您是否觉得难以罗列某种开发所包括对技术(技术栈)呢?   您是否想过: ...

  5. Web前端技术体系大全搜索

    一.前端技术框架 1.Vue.js 官网:https://cn.vuejs.org/ Vue CLI:https://cli.vuejs.org/ 菜鸟教程:http://www.runoob.com ...

  6. 当下较热web前端技术汇总

    Web前段技术发展很快,主流技术日新月异,想想自己刚毕业那会用的asp技术,现在已经很少有主流网站在使用了.再到后来的J2EE框架,然后SpringMVC大行其道,但是最近各种js框架被广为传播,Ht ...

  7. 最受欢迎web前端技术总结

    Web前端技术发展非常快,主流技术的进步.想想刚毕业那会用asp技术.目前,该网站已经非常少见主流应用. 后来的后来J2EE框架.然后SpringMVC声望,然而,最近的各种js框架广泛传播,Html ...

  8. 转:Web 测试的创作与调试技术

    摘要:学习有关 Visual Studio 2005 Web 测试的更多知识,包括 Web 测试引擎和记录器如何工作,以及如何创建有效的 Web 测试. 本页内容 读者 简介 记录一个 Web 测试  ...

  9. web前端(2)—— 前端技术介绍

    前端技术 前文了解了什么是前端,那么前端技术到底有哪些呢?最核心的就这三个: html/html5 css/css3 javascript 什么是HTML HyperText Markup Langu ...

随机推荐

  1. 012_go语言中的Functions 函数

    代码演示 package main import "fmt" func plus(a int, b int) int { return a + b } func plusPlus( ...

  2. 11 Linux(CentOS)用户与权限

    用户管理 root 在root用户下可以进行以下操作 useradd 用户名      新增用户 userdel 用户名       删除用户,同时应该删除家目录下的用户文件,与邮箱目录下的用户文件 ...

  3. csapp第六章笔记-存储器结构

    目录 随机访问存储器(Random-Access-Memory) 静态RAM 动态RAM 增强的DRAM 非易失性存储器 磁盘存储 磁盘构成 磁盘容量 磁盘操作 逻辑磁盘块 访问磁盘和连接I/O设备 ...

  4. C#LeetCode刷题之#14-最长公共前缀​​​​​​​(Longest Common Prefix)

    问题 该文章的最新版本已迁移至个人博客[比特飞],单击链接 https://www.byteflying.com/archives/3921 访问. 编写一个函数来查找字符串数组中的最长公共前缀. 如 ...

  5. kafka-clients 1.0 高阶API消费消息(未完)

    消费消息的请求(按序) org/apache/kafka/common/requests/RequestHeader org/apache/kafka/common/requests/ApiVersi ...

  6. topic相关问题

    1.下面是一个topic数据出现堵塞的情况示图. 如图所示,delta列表示当前分区未处理的数据条数,kafka current表示推送到topic的数据量,spout current表示已经处理的数 ...

  7. Kubernetes实战指南(三十三):都0202了,你还在手写k8s的yaml文件?

    目录 1. k8s的yaml文件到底有多复杂 2. 基于图形化的方式自动生成yaml 2.1 k8s图形化管理工具Ratel安装 2.2 使用Ratel创建生成yaml文件 2.2.1 基本配置 2. ...

  8. JavaScript学习系列博客_3_JavaScript中的变量、常量、标识符

    常量:就是改变不了的,也是可以直接使用的. 变量:可以改变的,不确定的. var =123456; 通过 var 声明一个变量,同时赋值给它 标识符:在JS中所有的可以自主命名的内容,都可以认为是一个 ...

  9. 进阶6:连接查询 一、sql92标准

    #进阶6:连接查询/*含义:又称多表查询,当查询的字段来自于多个表时,就会用到连接查询 笛卡尔乘积现象:表1 有m行,表2有n行,结果=m*n行 发生原因:没有有效的连接条件如何避免:添加有效的连接条 ...

  10. 第5章 JDBC/ODBC服务器

    第5章 JDBC/ODBC服务器 Spark SQL也提供JDBC连接支持,这对于让商业智能(BI)工具连接到Spark集群上以 及在多用户间共享一个集群的场景都非常有用.JDBC 服务器作为一个独立 ...