本文转自测试人社区,原文链接:https://ceshiren.com/t/topic/28735
JavaScript
简介
-
JavaScript 是一种脚本语言
- 一种轻量级的编程语言
- 是可插入 HTML 页面的编程代码
- 插入 HTML 页面后,可由所有的现代浏览器执行
-
作用
- 直接写入 HTML 输出流
- 对事件的反应
- 改变 HTML 内容
- 改变 HTML 图像
- 改变 HTML 样式
- 验证输入
用法
- 脚本必须位于
输出
- 显示数据
- 弹出警告框:window.alert()
- 将内容写到 HTML 文档中:document.write()
- 写入到浏览器的控制台:console.log()
基础语法
- 字面量
- 数字:整数、小数、科学计数法(e)
- 字符串:单引号、双引号
- 数组:[ 1],与python的列表 list 一样
- 对象:{ 1},与python的字典 dict 一样
- 函数:function,类似python的 def 函数关键字
- 变量
- 声明变量:var
- 赋值:=
- 操作符
- 算术运算符:=、 +、 -、 *、 /
- 赋值运算符: = 、 +=、 -=
- 比较运算符:<、>、 ==、 ===(从内容到类型完全相同)、 !=
- 函数
- 关键字:function
- function myFunction(a,b){return a*b;}
操作 HTMl DOM
-
文档对象模型:Document Object Mdel
-
查找 HTML 元素
- 通过 id:var x=document.getElementById(“xx”); 找到一个
- 通过标签名:var y=x.getElementByTagName(“p”); 找到一组
- 通过类名:var z=document.getElementByClassName(“xx”); 找到一组
-
改变 HTML
- 内容:document.gerElementById(id).innerHTML=新的HTML
- 属性:document.getElementById(id).attribute=新的属性值
-
Cookie
- 读取:var x = document.cookie;
-
使用事件
- 当用户点击鼠标时:οnclick=JavaScript
- 当网页已加载时:οnlοad=JavaScript
- 当图像已加载时:οnunlοad=JavaScript
- 当鼠标移动到元素上时:οnmοuseοver=JavaScript
- 当输入字段被改变时:οnchange=JavaScript
- 当用户触发按键时:οnmοusedοwn=JavaScript
操作浏览器 BOM
- 浏览器对象模型
- Window 对象
- 所有浏览器都支持 window 对象,它表示浏览器窗口
- 所有 JavaScript 全局对象、函数以及变量均自动成为 window 对象的成员
- HTML DOM 的 document 也是 window 对象的属性之一
- 浏览器窗口
- 获取浏览器窗口尺寸
- window.innerHeight:浏览器窗口的内部高度,包括滚动条
- window.innerWidth:浏览器窗口的内部宽度,包括滚动条
- 打开新窗口:window.open()
- 关闭当前窗口:window.close()
- 获取浏览器窗口尺寸
- 用户屏幕
- 可用的屏幕宽度:screen.availWidth
- 可用的屏幕高度:screen.availHeight
- 当前页面的地址
- 返回 web 主机的域名:location.hostname
- 返回当前页面的路径和文件名:location.pathname
- 返回所使用的 web 协议:location.protocol
- 浏览器的历史
- 与在浏览器点击后退按钮相同:history.back()
- 与在浏览器中点击向前按钮相同:history.forward()
推荐学习
【霍格沃兹测试开发】7天软件测试快速入门带你从零基础/转行/小白/就业/测试用例设计实战
【霍格沃兹测试开发】最新版!Web 自动化测试从入门到精通/ 电子商务产品实战/Selenium (上集)
【霍格沃兹测试开发】最新版!Web 自动化测试从入门到精通/ 电子商务产品实战/Selenium (下集)
【霍格沃兹测试开发】明星讲师精心打造最新Python 教程软件测试开发从业者必学(上集)
【霍格沃兹测试开发】明星讲师精心打造最新Python 教程软件测试开发从业者必学(下集)
【霍格沃兹测试开发】精品课合集/ 自动化测试/ 性能测试/ 精准测试/ 测试左移/ 测试右移/ 人工智能测试
【霍格沃兹测试开发】腾讯/ 百度/ 阿里/ 字节测试专家技术沙龙分享合集/ 精准化测试/ 流量回放/Diff
【霍格沃兹测试开发】Pytest 用例结构/ 编写规范 / 免费分享
【霍格沃兹测试开发】JMeter 实时性能监控平台/ 数据分析展示系统Grafana/Docker 安装
【霍格沃兹测试开发】接口自动化测试的场景有哪些?为什么要做接口自动化测试?如何一键生成测试报告?
【霍格沃兹测试开发】面试技巧指导/ 测试开发能力评级/1V1 模拟面试实战/ 冲刺年薪百万!
【霍格沃兹测试开发】腾讯软件测试能力评级标准/ 要评级表格的联系我
【霍格沃兹测试开发】Pytest 与Allure2 一键生成测试报告/ 测试用例断言/ 数据驱动/ 参数化
【霍格沃兹测试开发】App 功能测试实战快速入门/adb 常用命令/adb 压力测试
【霍格沃兹测试开发】阿里/ 百度/ 腾讯/ 滴滴/ 字节/ 一线大厂面试真题讲解,卷完拿高薪Offer !
【霍格沃兹测试开发】App自动化测试零基础快速入门/Appium/自动化用例录制/参数配置
【霍格沃兹测试开发】如何用Postman 做接口测试,从入门到实战/ 接口抓包(最新最全教程)
【霍格沃兹测试开发】6 小时轻松上手功能测试/ 软件测试工作流程/ 测试用例设计/Bug 管理
【霍格沃兹测试开发】零基础小白如何使用Postman ,从零到一做接口自动化测试/ 从零基础到进阶到实战
【霍格沃兹测试开发】建议收藏全国CCF 测试开发大赛Python 接口自动化测试赛前辅导 / 项目实战
更多软件测试开发视频教程点此
软件测试职业发展
零基础入门
测试必备编程篇
自动化测试
性能测试
测试管理
工程效能篇
面试求职篇
软件测试的面试宝典,内含一线互联网大厂面试真题、面试技巧、软件测试面试简历指导,免费领取!