Evento de carga de ventana:
eventos de compatibilidad para ajustar el tamaño de la ventana:
ventana El método .open() se puede utilizar para navegar a una URL específica o para abrir una nueva ventana del navegador.
window.open("http://www.wrox.com/", "wroxWindow","height=400,width=400,top=10,left=10,resizable=yes");temporizador:
window.scroll(x, y)
window.scrollTo(x, y): Ambos tienen el mismo uso para cambiar la posición horizontal y barras de desplazamiento verticales, siempre que debe haber La barra de desplazamiento está en la página
window.scrollBy(x, y): El desplazamiento acumulativo de la barra de desplazamiento, los números positivos bajan, los números negativos suben window.scrollBy(0, 10) : Cuando se llama cada 100 milisegundos, la barra de desplazamiento se mueve 10 píxeles.
ventana. getComputedStyle (elem, pseudoclase)
cuadro de diálogo
ejecuta el script js y coloca el código js en la pila de ejecución en un modo de ejecución sincrónico. Al ejecutar la pila de ejecución, encuentra código asincrónico JS (eventos, temporizadores, ajax, carga de recursos). , error) se coloca en las API web (cola de tareas). Cuando se completa el código en la pila de ejecución, vaya a la cola de tareas y tome la primera para su ejecución. Después de la ejecución, obtenga una de la cola de tareas y ejecútela. ejecútelo repetidamente (bucle de eventos) hasta que se complete la ejecución en la cola de tareas.
window.history se utiliza para obtener la dirección URL de la página actual y redirigir el navegador a una nueva página.
http://www.itcast.cn:80/index.html?name=andy&age=1#link http: protocolo de comunicación www.itcast.cn: nombre de dominio 80: puerto index.html: ruta?nombre=andy&age=1: parámetro #fragmento de enlace: punto de anclaje,
atributo de objeto de enlace:
método del objeto de protocolo de la URL actual:
navegador: un objeto que encapsula la información de configuración del navegador
window.history el objeto incluye la colección del historial del navegador (url)
El objeto window.screen contiene información sobre el usuario 
// pantalla: obtiene el tamaño de resolución del dispositivo de visualización // resolución completa: pantalla.ancho/alto // Cómo identificar el tipo de cliente compatible con todos los anchos de cliente // Pantalla grande, pantalla mediana, pantalla pequeña, pantalla ultrapequeña // lg md sm xs // TV pc pad teléfono //Ancho >= 1200 >=992 >= 768 < 768 //La resolución restante después de eliminar la barra de tareas // screen.availHeight/availWidth
puede obtener dinámicamente la posición (desplazamiento), tamaño, etc. del elemento.
Atributos de uso común de la serie de desplazamiento:
atributos comunes
como el tamaño del borde y el tamaño del elemento de los elementos
:obtiene dinámicamente el tamaño y la distancia de desplazamiento de los elementos.
Atributos comunes
barra de desplazamiento de unidad Al desplazarse, se activará el evento de desplazamiento.
window.pageXOffset/pageYOffset IE8 y versiones inferiores no son compatibles con document.body/documentElement.scrollLeft/scrollTop La compatibilidad es confusa y lleva mucho tiempo agregar dos valores, porque es imposible. Para que dos valores tengan valores al mismo tiempo . Método de compatibilidad de encapsulación, encuentre la distancia de desplazamiento de la rueda de la barra de desplazamiento getScrollOffet()
/*
Encapsula un método para obtener la distancia de desplazamiento de la barra de desplazamiento Devuelve: x: la distancia de desplazamiento de la barra de desplazamiento horizontal y: la distancia de desplazamiento de la barra de desplazamiento vertical */función getScrollOffet(){.
si(ventana.pageXOffset){
El retorno {//{} del objeto debe estar después de la palabra clave; de lo contrario, el sistema lo agregará automáticamente y el valor de retorno no estará definido;
x: ventana.páginaXOffset,
y: ventana.páginaYOffset}
}else{//Compatible con IE8 e inferiores return {
x: documento.body.scrollLeft + documento.documentElement.scrollLeft,
y : documento.body.scrollTop + documento.documentElement.scrollTop }
}} window.innerWidth/innerHeight no es compatible con IE8 y versiones anteriores (nota: el ancho y el alto aquí no incluyen el alto de la barra de menú, barra de herramientas, barra de desplazamiento, etc.) document.documentElement.clientWidth/clientHeight en modo estándar, cualquier navegador es compatible con document.body.clientWidth/clientHeight Es un método de compatibilidad de encapsulación del navegador adecuado para situaciones extrañas. Devuelve el tamaño de la ventana gráfica del navegador getViewportOffset()
/*La encapsulación devuelve el valor de retorno del tamaño de la ventana gráfica del navegador. :
w: ancho de la ventana gráfica h: alto de la ventana gráfica*/función getViewportOffset(){
si(ventana.anchointerior){
devolver {
w: ventana.anchointerior,
h: ventana.alturainterior}
}else{ //Compatible con navegadores IE8 y anteriores if(document.compatMode == 'BackCompat'){
//Return { en modo de renderizado extraño
w: documento.body.clientWidth,
h: documento.cuerpo.alturadelcliente}
}demás{
// retorno del modo estándar {
w: documento.documentElement.clientWidth,
h: documento.documentElement.clientHeight }
}
}}console.log(document.compatMode); // modo extraño BackCompat // modo estándar CSS1Compat domElement.getBoundingClientRect() tiene buena compatibilidad y devuelve un objeto que contiene left; , Atributos como arriba, derecha e inferior. Izquierda y superior representan las coordenadas X e Y de la esquina superior izquierda del elemento. Derecha e inferior representan las coordenadas X e Y de la esquina inferior derecha del elemento. Los atributos de ancho no se implementan en versiones anteriores de IE. Los resultados devueltos no son en tiempo real. '
// Obtiene la posición del elemento en la función del documento getElementPosition(target){.
//Soporta el método BoundingClientRect() if(0 && target.getBoundingClientRect){
var pos = target.getBoundingClientRect();
return { // Cuando la barra de desplazamiento se mueve, agrega la posición x de la barra de desplazamiento: pos.left + Math.max(document.body.scrollLeft, document.documentElement.scrollLeft),
y : pos.top + Math.max(document.body.scrollTop, document.documentElement.scrollTop)
}
} demás {
varpos = {
izquierda: 0,
arriba: 0
}
var _elm = objetivo;
while(objetivo.offsetParent){
if(_elm == target){//Acumula izquierda y arriba por primera vez
pos.izquierda += objetivo.offsetLeft;
pos.top += objetivo.offsetTop;
}demás{
pos.izquierda += objetivo.offsetLeft + objetivo.clientLeft;
pos.top += target.offsetTop + target.clientTop;
}
// el objetivo reasigna el objetivo = target.offsetParent;
}
retorno {x: pos.izquierda, y: pos.arriba}
}} Barra de estado de
posición de la ventana de
visualización del estado del navegadory otros atributos