Home >Web Front-end >JS Tutorial >js knowledge collection on BOM operations
This time I will bring you the knowledge about BOM operations in js. What are the precautions for BOM operations in js? The following is a practical case, let’s take a look.
confirm("confirmation information")
prompt("pop-up input box")
open("url address", "open mode (can be -self or -black)", "the size of the new window") Note: If the url is empty, a blank page will be opened by default. If the opening method is empty, the page will be opened in a new window by default. The return value is: Return the window object of the newly opened window
window.resizeTo() - Adjust the size of the current window
setInterval(function, time) Execute infinitely
location.herf = 'url address'
hash Returns the string after the # sign. It does not contain the hash, otherwise an empty string is returned.
host returns the server name and port number
pathname returns the directory and file name. /project/test.html
search returns? All values after the number.
port Returns the specified port number in the URL. If the URL does not contain the port number, an empty string is returned.
portocol Returns the protocol used by the page. http: or https:
3), navigator object
window.navigator object contains information about the visitor's browser. You can write without using the window prefix.
navigator.platform: operating system type;
navigator.userAgent: User-Agent string set by the browser.
navigator.appName: browser name;
navigator.appVersion: browser version;
navigator.language: browser setting language;
userAgent is the most commonly used attribute and is used to complete browser judgment.
if(window.navigator.userAgent.indexOf('MSIE')!=-1){ alert('我是IE'); }else{ alert('我不是IE'); }
4), screen object
window.screen object contains information about the user's screen.
The screen.availWidth property returns the width of the visitor's screen, in pixels, minus interface features such as the window taskbar. The screen.availHeight property returns the height of the visitor's screen, in pixels, minus interface features such as the window taskbar.
document.write(screen.availHeight+screen.availWidth);//获取屏幕的宽度和高度之和
5), history object
window.history 对象包含浏览器的历史。为了保护用户隐私,对 JavaScript 访问该对象的方法做出了限制。 history.back() - 加载历史列表中的前一个 URL。返回上一页。 history.forward() - 加载历史列表中的下一个 URL。返回下一页。 go(“参数”) -1表示上一页,1表示下一页。
Based on the above, the methods for page jump are:
1、window.location.href = '你所要跳转到的页面'; 2、window.open('你所要跳转到的页面’); 3、window.history.back(-1):返回上一页 4、window.history.go(-1/1):返回上一页或下一页五、 5、history.go("baidu.com");
5. Window Size and Size
可视区尺寸: document.documentElement.clientWidth document.documentElement.clientHeight 滚动条滚动距离: document.documentElement.clientScrollTop document.documentElement.clientScrollLeft
There is a compatibility issue (Chrome is different from other browsers), the solution is as follows
var scrollTop = document.documentElement.scrollTop||document.body.scrollTop; var scrollLeft = document.documentElement.scrollTop||document.body.scrollLeft;
Content height/width: element.scrollHeight/scrollWidth
The distance between the mouse and the visible area of the page when a time occurs: clientX/clientY
6. System dialog box
alert()、confirm()和prompt() <script type="text/javascript"> alert("Hello world!"); </script> <script type="text/javascript"> /* 判断用户点击了OK还是Cancel,可以检查confirm()方法返回的布尔值:true表示单击了OK,false表示单击了Cancel或单击了右上角的X按钮。 */ if (confirm("Are you sure?")) { alert("I'm so glad you're sure! "); } else { alert("I'm sorry to hear you're not sure. "); } </script> <script type="text/javascript"> /* prompt()方法用来生成一个"提示"框,用于提示用户输入一些文本。提示框除了显示OK和Cancel按钮之外 ,还会显示一个文本输入域,用来输入文本内容。该方法接收两个参数:要显示给用户的文本提示和文本输入域的默认值(可以是一个空字符串) */ var result = prompt("What is your name? ", ""); if (result !== null) { alert("Welcome, " + result); } </script>
I believe you have mastered the method after reading the case in this article. For more exciting information, please pay attention to other related articles on the php Chinese website!
Related reading:
The above is the detailed content of js knowledge collection on BOM operations. For more information, please follow other related articles on the PHP Chinese website!