JAVA后端需要会js吗_Java后端需要掌握的JS-------BOM
Java后端需要掌握的JS-------BOM
1.什么是BOM
这个全称是Browser Object Model浏览器对象模型,将浏览器各个组成部分封装成对象
2.BOM的五大对象
先来看一张图:
五大基本的对象位置大概如上图,主要就是下面的五个:
Window:窗口对象(重点)
Navigator:浏览器对象
Screen:显示器屏幕对象
History:历史记录对象(重点)
Location:地址栏对象(重点)
上面的三个加黑的是常用到的,必须要熟练,具体使用如下:
1.Window:窗口对象(重点)
窗口对象的特点:
Window对象不需要创建可以直接使用 window使用。 window.方法名();
window引用可以省略。 方法名();
这也是我们学习js常用的,像之前的alert()方法,其实可以写成window.alert(),不过由于语法可以直接写,window省略了。
窗口对象的两个属性
获取其他BOM对象:
history
location
Navigator
Screen:
获取DOM对象
document
常用的方法(重点)
这里我将其分为了几个小类,便于记忆:
与弹出窗口相关的方法 //1.与窗口弹出相关的方法
//1.警告窗口
alert("警告窗");
//2.误操作弹出窗
var b = confirm("你确定要删除吗?");
if (b) {
alert(b+"删除成功");
}else{
alert(b+"取消删除");
}
//3.输入框
var s = prompt("请输入你的名字");
alert("你的名字是"+s);
上面的用的最多的是confirm()方法,需要重点掌握,开发中用到最多的也是这个方法。
与窗口关闭和打开相关的方法
//2.与窗口关闭和打开相关的方法
//1.打开新窗口
var baidu;
var openBtn = document.getElementById("openBtn");
openBtn.onclick = function(){
baidu = open("https://www.baidu.com");
};
//关闭打开的百度
var closeBtn = document.getElementById("closeBtn");
closeBtn.onclick = function(){
baidu.close();
}
上面的做了 一个处理,想要关闭新打开页面,就要给一个open()的返回值,通过这个返回值去调用close()方法。否则关闭的是当前的页面。
与计时器相关的方法 function fun() {
alert("开始了...");
}
//1.一次性定时器以及取消一次性定时器
//setTimeout("fun()",2000);
var time = setTimeout(fun,2000);//设置2s的定时器
clearTimeout(time);//取消上面的定时器
//2.循环定时器以及取消循环定时器
var interval = setInterval(fun,2000);//设置2s的循环定时器
clearInterval(interval);//取消上面的定时器
这四个方法,在开发中也能用到,比如不用BootStrap,我们手写轮播图,就需要用到。
那么这里我给个简单轮播图的写法,当然实际开发中,不许要我们手写,BootStrap可以帮我们解决。
轮播图
var num = 1;//初始为第一张图片
function change(){
//当超过第四张的时候返回第一张
if (num >4){
num = 1;
}
num++;
pic.src="../img/"+num+".jpg";
}
//设置2s换一张图
setInterval(change,2000);
2.Location地址栏对象
1. 创建(获取):
1. window.location
2. location
2. 方法:
reload()重新加载当前文档。刷新
3. 属性
href设置或返回完整的 URL。
这里方法和属性有很多,不过毕竟是后端学习,我就没有学习那么多,就学用的最多的,举例:
Location
flush.οnclick=function(){
location.reload();//刷新
}
var change = document.getElementById("change");
change.οnclick=function(){
location.href="https://www.baidu.com";
}
3.History历史记录对象
1. 创建(获取):
1. window.history
2. history
2. 方法:
* back()加载 history 列表中的前一个 URL。
* forward()加载 history 列表中的下一个 URL。
* go(参数)加载 history 列表中的某个具体页面。
* 参数:
* 正数:前进几个历史记录
* 负数:后退几个历史记录
3. 属性:
* length返回当前窗口历史列表中的 URL 数量。
JAVA后端需要会js吗_Java后端需要掌握的JS-------BOM相关推荐
- java后台jd_2017春季_京东_Java后端研发岗面经
纸上得来终觉浅,绝知此事要躬行 --2017春季Java后端研发工程师面试心得 收获offer:上海汉得+北京中科软+成都百词斩+成都诺基亚研发中心+清华大学计算机研究所等offer.阿里一面猝.京东 ...
- java实现微信、手机号登陆_Java后端解密微信小程序手机号数据
小程序端登录后,得到登录时获取的 code(仅可使用一次) App({ onLaunch: function () {//登录 wx.login({ success: res=>{//发送 re ...
- java接受formdata文件上传_java后端发送formdata上传文件
今天想实现 java 后端发送 formdata 上传文件,为了以后查找方便,特此记录下来 上一次使用 WebClient 实现远程调用 (一个非阻塞.响应式的HTTP客户端,它以响应式被压流的方式执 ...
- java后端概述_Java后端测试概述
[本文出自天外归云的博客园] 多种单测技术 1. 要学会Spring MVC/Boot测试中自带的mock方法. 2. 学会junit中的方法,对于注解的使用等. 3. 学会使用结合第三方Mockit ...
- vue 新建的页面如何访问_Vue.js—实现前后端分离架构中前端页面搭建(四)(完)...
[Vue.js实现前后端分离架构中前端页面搭建] 二十.实现服务端登录业务 前提:已经有单机版Eureka,端口8761.启动开Eureka 1. 新建父项目 新建backend_parent. 为了 ...
- wed后端和java的区别_web前端和web后端的区别详细分析
原标题:web前端和web后端的区别详细分析 在刚开始从事web开发时,首先要选准学习方向,看是想从事前端部分还是后端程序部分.当然在工作的后期,就不会分的那么细致了.做前端到后期也会懂一些后端的技术 ...
- ASP.NET Core 实战:使用ASP.NET Core Web API 和 Vue.js 搭建前后端分离项目
一.前言 这几年前端的发展速度就像坐上了火箭,各种的框架一个接一个的出现,需要学习的东西越来越多,分工也越来越细,作为一个 .NET Web 程序猿,多了解了解行业的发展,让自己扩展出新的技能树,对自 ...
- mock模拟接口测试 vue_vue+mock.js实现前后端分离
之前都是介绍在普通项目中使用mock.js,那么本次就来介绍一下在vue中使用mock.js实现前后端分离. 安装: npm install mockjs 这里先写个小案例介绍一下具体使用,写法不规范 ...
- 一统江湖的大前端(2)—— Mock.js + Node.js 如何与后端潇洒分手
<一统江湖的大前端>系列是自己的前端学习笔记,旨在介绍javascript在非网页开发领域的应用案例和发现各类好玩的js库,不定期更新.如果你对前端的理解还是写写页面绑绑事件,那你真的是有 ...
最新文章
- 关于mysql的ddl_log.log文件
- Vue实现仿音乐播放器7-实现音乐榜单效果
- 用开源NAC阻止非法网络访问
- Docker打包 Asp.Net Core应用,在CentOS上运行
- 常用计算机网络技术缩写词和术语,网络技术缩写词和术语
- 织梦php echo 调用金币,dedecms实现任意页面调用当前会员信息的方法
- 数据库系统基础教程复习
- 2020网络安全NISP一级题库
- 家居行业如何做好私域布局?
- c语言混合运算优先级判断,《C语言解惑》—— 3.1 混合运算要小心
- 技嘉B460M小雕板win2012 R2安装网卡驱动
- canvas图片处理
- 获取所有节假日及周末
- springboot前后端分离 前端请求图片问题
- st3搭建python开发环境
- 0x01 - 前期信息收集
- 牛客网暑期ACM多校训练营(第二场)A .run
- 冷启动、微创新、产品思维,一家AI公司孵化输入法的跋涉之路
- Linux高并发服务器开发---笔记1(环境搭建、系统编程、多进程)
- sql语句中的or用法(及与and和in区别)
热门文章
- VS2017 CUDA编程学习11:CUDA性能测量
- 苏宁iphone俱乐部会员服务,葫芦里装的什么药?
- Red Hat6 Linux镜像文件,如何下载红帽企业版Linux的ISO镜像文件,如何开始安装红帽企业版Linux?...
- Centos 7.4母盘制作、Xshell连接
- html怎么设置好看的文本框,html页面输入框input的美化
- 微信小程序将html转为wxml开发案例
- VUE ElementUI中table框设置文字超出隐藏及设置提示框样式
- codevs 过路费
- 用Python分析S11决赛EDGvsDK,教你怎么硬核吹EDG
- liunx 谷歌浏览器清空缓存命令