js中常用方法以及document.readyState 判断页面是不是加载完成 complete和interactive
Posted
tags:
篇首语：本文由小常识网(cha138.com)小编为大家整理，主要介绍了js中常用方法以及document.readyState 判断页面是不是加载完成 complete和interactive相关的知识，希望对你有一定的参考价值。
参考技术A js中常用方法以及document.readyState 判断页面是否加载完成 complete和interactive传回XML 文件资料的目前状况。 基本语法 intState ＝ xmlDocument.readyState; 说 明 这个属性是只读的，传回值有以下的可能： 0-UNINITIALIZED：XML 对象被产生，但没有任何文件被加载。 1-LOADING：加载程序进行中，但文件尚未开始解析。 2-LOADED：部分的文件已经加载且进行解析，但对象模型尚未生效。 3-INTERACTIVE：仅对已加载的部分文件有效，在此情况下，对象模型是有效但只读的。 4-COMPLETED：文件已完全加载，代表加载成功。 范 例 alert("The readyState property is " + xmlDoc.readyState);
1.窗口关闭时执行的函数 window.onbeforeunload = function()
2.页面加载情况判断document.readyState值可以是complete和interactive
function document.onreadystatechange() if(document.readyState=="complete") alert(document.readyState);
或者：
document.onreadystatechange = init;
function init()
if(document.readyState=="complete") .........
3.屏蔽右键功能和严禁选中操作
//document.oncontextmenu=new Function("event.returnValue=false;");
//document.onselectstart=new Function("event.returnValue=false;");
4.鼠标位置判断
window.event.y和window.event.x //x,y是鼠标相对于当前浏览器的位置
window.event.screenY和window.event.screenX //screenX,screenY是相对于用户显示器的位置
window.event.clientY和window.event.clientX //clientX, clientY是鼠标当前相对于网页的位置，
window.event.offsetY和window.event.offsetX //offsetX, offsetY是鼠标当前相对于网页中的某一区域的位置，当鼠标位于页面中这一区域的左上角时offsetX=0, offsetY=0；
5.窗口大小判断
document.documentElement.scrollWidth和document.documentElement.scrollHeight //获取窗口的宽和高
6.返回值
window.event.returnValue="真的要关闭吗"; //弹出一个确认信息,确认事件是否要执行
return confirm("真的要关闭吗"); //两个是一样的功能
7.获取随机数 parseInt(Math.random()*100) //获取1至100之间的随机数
jQuery常用方法以及demo
<!doctype html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>jQuery案例</title>
<script src="jquery-1.12.2.js"></script>
</head>
<body>
<div id="dv">
<div>123</div>
</div>
<script>
// empty(); empty 给所选的元素清空所有后代 （给div的所以子集添加一个innerHTML=空字符串）
// $(‘#dv‘).empty();
// append(); 把append后面的东西放到$()对象里面
//$(‘#dv‘).append(‘<p>465</p>‘) //结果 123 456
//appendTo(): 把appendTo后面的东西放到$()对象里面 可以简即 吐到什么什么里面
// $(‘<p>456</p>‘).appendTo(‘#dv‘);//结果 123 456和append结构一样
</script>
<div id="dv1">
<div>123</div>
</div>
<span>span1</span>
<span class="sp">span2</span>
<script>
// next(): 获取指定元素的下一个兄弟元素
// var temp=$(‘#dv1‘).next();
// console.log(temp);
// nextAll() : 获取指定元素的下面所以兄弟元素
// var temp=$(‘#dv1‘).nextAll();
// console.log(temp);
// prev() : 获取指定元素的前一个兄弟元素
// var temp= $(‘.sp‘).prev();
// console.log(temp);
// prevAll():获取指定元素的前面所以兄弟元素
// var temp = $(‘.sp‘).prevAll();
// console.log(temp);
// before() 方法在被选元素前面插入内容（作为兄弟关系）
// $(‘.sp‘).before(‘<p>ppp</p>‘);
</script>
<div class="dv2">a</div>
<div class="dv2">b</div>
<div class="dv2">c</div>
<div class="dv2">d</div>
<div class="dv2">e</div>
<script>
// each用法 ： 要遍历的元素如果放在each前面的话那么遍历只有一个参数回调函数
// $(‘.dv2‘).each(function(i,v){
// $(v).click(function(){
// alert(i);
// });
// });
// each用法：如果直接是$.each那么后边有两个参数， 第一个是要遍历的元素 第二个是回调函数
// $.each($(‘.dv2‘),function(i,v){
// $(this).click(function(){
// alert(i)
// })
// })
// on的用法: on用于绑定事件
$(‘.dv2‘).on(‘click‘, function () {
alert(‘我被点击了‘);
})
</script>
<script>
// addclass() 向一个元素添加一个类
// $("p:first").addClass("intro"); 向第一个 p 元素添加一个类
//
// removeClass() 从一个元素里移除一个类
// $("p:first").removeClass("intro");
//
// toggleclass() 切换class有移除没有添加 toggle开关的意思
// $("div").toggleClass("main");
</script>
</body>
</html>
以上是关于js中常用方法以及document.readyState 判断页面是不是加载完成 complete和interactive的主要内容，如果未能解决你的问题，请参考以下文章