专业编程基础技术教程

网站首页 > 基础教程 正文

话说前端38-BOM对象(前端bom和dom什么区别)

ccvgpt 2024-07-24 11:11:45 基础教程 19 ℃

分享兴趣,传播快乐,

话说前端38-BOM对象(前端bom和dom什么区别)

增长见闻,留下美好!

亲爱的您,这里是LearningYard新学苑。

今天小编为你带来flexsim软件使用的知识(4),

欢迎您的访问!

Share interests, spread happiness,

increase knowledge, and leave beautiful!

Dear you, this is LearningYard Academy.

Today,the editor brings you the knowledge of using flexsim software (38),

welcome your visit!

什么是BOM:

BOM即浏览器对象模型。

BOM提供了独立于内容 而与浏览器窗口进行交互的对象;

由于BOM主要用于管理窗口与窗口之间的通讯,因此其核心对象是window;(功能)

window是浏览器的内置对象,里面包含着操作浏览器的方法

BOM由一系列相关的对象构成,并且每个对象都提供了很多方法与属性;

BOM缺乏标准,JavaScript语法的标准化组织是ECMA,DOM的标准化组织是W3C,BOM最初是Netscape浏览器标准的一部分。

What is BOM:

That is, BOM browser object model.

BOM provides objects that interact with browser windows independently of content;

As BOM is mainly used to manage the communication between windows, its core object is Window. (function)

Window is the built-in object of the browser, which contains the methods to operate the browser.

BOM is composed of a series of related objects, and each object provides many methods and attributes.

Lack of BOM standard, the standardization organization of JavaScript syntax is ECMA, the standardization organization of DOM is W3C, and BOM was originally a part of Netscape browser standard.

浏览器操作

获取浏览器的相关信息(窗口大小)

操作浏览器跳转页面

获取浏览器的地址栏信息

操作浏览器的滚动条

明白浏览器的信息(浏览器的版本)

还有我们之前接触过的alert/prompt/comfirm

Browser operation

Get information about the browser (window size)

Operation browser jump page

Get the address bar information of the browser

Operate the scroll bar of the browser.

Understand the information of the browser (version of the browser)

And the alert/prompt/comfirm that we have contacted before.

BOM的使用

innerWidth、innerHeight这两个方法获取浏览器的宽高(包含滚动条的)。window.innerWidth

alert()弹出层。

prompt()用户输入。

confirm()确定取消。

我们之后也会很少去使用弹出层,因为它会阻塞我们后面代码的执行。也不会设置它们的样式

Use of BOM

The two methods, innerWidth and innerHeight, get the width and height of the browser (including the scroll bar). window.innerWidth

Alert () popup layer.

Prompt () user input.

Confirm () Confirm to cancel.

After that, we will rarely use the pop-up layer, because it will block the execution of the code behind us. They are not styled either.

BOM的location对象:location 是最有用的 BOM 对象之一,提供了当前窗口中加载文档的信息,以及通常的导航功能。主要是对浏览器url地址相关数据的获取和定义。window 对象给我们提供了一个 location 属性用于获取或设置窗体的 URL,并且可以用于解析 URL 。 因为这个属性返回的是一个对象,所以我们将这个属性也称为 location 对象。

Location object of BOM: location is one of the most useful BOM objects, which provides the information of documents loaded in the current window and the usual navigation functions. It is mainly about the acquisition and definition of browser url address related data. Window object provides us with a location property to get or set the URL of the form, and can be used to resolve the URL. Because this property returns an object, we also call this property location object.

可以使用decodeURIComponent(username[1]);来解决乱码问题

我们去获取地址栏中的参数的时候,我们一般会使用location.search获取到‘?’以及问号后面的内容

(类似于"?name=lc&age=20")。这样的话我们如果要获取到地址栏中真正的参数就需要用字符串的截取方式把‘?’给截取掉。但是我们现在有URLSearchParams。

使用特点:URLSearchParams() 构造器 创建并返回一个新的URLSearchParams 对象。 开头的’?’ 字符会被忽略。

When we go to get the parameters in the address bar, we usually use location.search to get'?' And what follows the question mark.

(similar to "? name=lc&age=20")。 In this way, if we want to get the real parameters in the address bar, we need to intercept the'?' Cut it off. But we have URLSearchParams now.

Features: The URLSearchParams () constructor creates and returns a new URLSearchParams object. The beginning'? The' character will be ignored.

今天的分享就到这里了,

如果您对文章有独特的想法,欢迎给我们留言。

让我们相约明天,祝您今天过得开心快乐!

That'sit for today's sharing.

If you have a unique idea about the article.

please leave us a message.

Let us meet tomorrow,

I wish you a happy day today!


翻译:百度翻译

声明:本文由LearningYard新学苑原创,如有侵权,请联系删除!

文案&排版|李仕阳

审核|维安

最近发表
标签列表