Evento de carregamento de janela:
eventos de compatibilidade para ajustar o tamanho da janela:
window O método .open() pode ser usado para navegar até uma URL específica ou para abrir uma nova janela do navegador.
window.open("http://www.wrox.com/", "wroxWindow","height=400,width=400,top=10,left=10,resizable=yes");timer:
window.scroll (x, y)
window.scrollTo (x, y): Ambos são o mesmo uso para alterar a posição da horizontal e barras de rolagem verticais, desde que haja A barra de rolagem está na página
window.scrollBy (x, y): A rolagem cumulativa da barra de rolagem, números positivos descem, números negativos sobem window.scrollBy (0, 10) : Quando chamada a cada 100 milissegundos, a barra de rolagem se move 10 pixels
window.getComputedStyle(elem, pseudo-class)
caixa de diálogo
executa o script js e coloca o código js na pilha de execução em um modo de execução síncrona. Ao executar a pilha de execução, ele encontra código assíncrono JS (eventos, temporizadores, ajax, carregamento de recursos). , erro) é colocado em APIs da web (fila de tarefas). Quando o código na pilha de execução for concluído, vá para a fila de tarefas e pegue o primeiro para execução. Após a execução, obtenha um da fila de tarefas e execute-o. execute-o repetidamente (loop de eventos) até que a execução na fila de tarefas seja concluída.
window.history é usado para obter o endereço URL da página atual e redirecionar o navegador para uma nova página.
http://www.itcast.cn:80/index.html?name=andy&age=1#link http: protocolo de comunicação www.itcast.cn: nome de domínio 80: porta index.html: caminho?name=andy&age=1: parâmetro #fragmento de link: ponto de ancoragem,
atributo de objeto de link:
método do objeto de protocolo da URL atual:
navigator: um objeto que encapsula informações de configuração do navegador
window.history objeto inclui a coleção de histórico (url) do navegador
window.screen contém informações sobre o usuário 
// tela: obtém o tamanho da resolução do dispositivo de exibição // Resolução total: screen.widht/height // Como identificar o tipo de cliente compatível com todas as larguras de cliente // Tela grande, tela média, tela pequena, tela ultrapequena // lg md sm xs // TV pc pad telefone //Largura >= 1200 >=992 >= 768 < 768 //A resolução restante após a remoção da barra de tarefas // screen.availHeight/availWidth
pode obter dinamicamente a posição (deslocamento), tamanho, etc. do elemento.
Atributos comumente usados da série de deslocamento:
atributos comuns,
como o tamanho da borda e o tamanho do elemento dos elementos
:obtém dinamicamente o tamanho e a distância de rolagem dos elementos.
Atributos comuns
barra de rolagem de unidade. Ao rolar, o evento onscroll será acionado.
window.pageXOffset/pageYOffset IE8 e abaixo não são compatíveis com document.body/documentElement.scrollLeft/scrollTop A compatibilidade é confusa e leva muito tempo. para que dois valores tenham valores ao mesmo tempo . Método de compatibilidade de encapsulamento, encontre a distância de rolamento da roda da barra de rolagem getScrollOffet()
/*
Encapsula um método para obter a distância de rolagem da barra de rolagem Retorna: x: a distância de rolagem da barra de rolagem horizontal y: a distância de rolagem da barra de rolagem vertical */function getScrollOffet(){
if(window.pageXOffset){
o retorno {//{} do objeto deve estar após a palavra-chave, caso contrário o sistema irá adicioná-lo automaticamente e o valor de retorno será indefinido;
x: janela.pageXOffset,
y: window.pageYOffset}
}else{//Compatível com IE8 e versões anteriores return {
x: document.body.scrollLeft + document.documentElement.scrollLeft,
y: document.body.scrollTop + document.documentElement.scrollTop }
}} window.innerWidth/innerHeight não é compatível com IE8 e anteriores (nota: a largura e a altura aqui não incluem a altura da barra de menu, barra de ferramentas, barra de rolagem, etc.) document.documentElement.clientWidth/clientHeight no modo padrão, qualquer navegador é compatível com document.body.clientWidth/clientHeight É um método de compatibilidade de encapsulamento do navegador adequado para situações estranhas
. :
w: largura da janela de visualização h: altura da janela de visualização*/function getViewportOffset(){
if(janela.innerWidth){
retornar {
w: janela.innerWidth,
h: window.innerHeight}
}else{ //Compatível com navegadores IE8 e anteriores if(document.compatMode == 'BackCompat'){
//Retorna { no modo de renderização estranho
w: document.body.clientWidth,
h:document.body.clientHeight}
}outro{
//modo padrão return {
w: document.documentElement.clientWidth,
h:document.documentElement.clientHeight}
}
}}console.log(document.compatMode); // modo estranho BackCompat // modo padrão CSS1Compat domElement.getBoundingClientRect() tem boa compatibilidade, que contém left; , Atributos como superior, direito e inferior representam as coordenadas X e Y do canto superior esquerdo do elemento. Direito e inferior representam as coordenadas X e Y do canto inferior direito do elemento. atributos de largura não são implementados em versões antigas do IE Os resultados retornados não são em tempo real. '
// Obtém a posição do elemento no documento function getElementPosition(target){
//Suporte ao método BoundingClientRect() if(0 && target.getBoundingClientRect){
var pos = target.getBoundingClientRect();
return { // Quando a barra de rolagem se move, adicione a posição x da barra de rolagem: pos.left + Math.max(document.body.scrollLeft, document.documentElement.scrollLeft),
y: pos.top + Math.max(document.body.scrollTop, document.documentElement.scrollTop)
}
} outro {
var pos = {
esquerda: 0,
topo: 0
}
var _elm = alvo;
enquanto(target.offsetParent){
if(_elm == target){//Acumule à esquerda e ao topo pela primeira vez
pos.esquerda += alvo.offsetLeft;
pos.top += alvo.offsetTop;
}outro{
pos.left += target.offsetLeft + target.clientLeft;
pos.top += target.offsetTop + target.clientTop;
}
// target reatribui target = target.offsetParent;
}
retornar {x: pos.esquerda, y: pos.top}
}} Barra de status de
posição da janela
de exibição do status do navegadore outros atributos