JavaScript Window Object

Previous Table of Contents Next
JavaScript Math Object JavaScript Document Object

Purchase and download the full PDF version of this JavaScript eBook for only $8.99

O JavaScript objeto de janela senta-se no topo da hierarquia de Objeto de JavaScript e representa a janela do browser (ou windows se você tiver mais de uma janela do navegador abertas ao mesmo tempo). Até este capítulo temos focado nos internos e na sintaxe do JavaScript. Neste capítulo vamos começar a fazer as coisas acontecerem na tela (que, afinal, é um dos principais propósitos do JavaScript). O objecto da janela permite aos programadores executar tarefas como abrir e fechar as janelas do navegador, mostrar as janelas de alerta e de alerta e configurar os tempos-limite (especificando uma acção a ter lugar após um determinado período de tempo). Embora os Timeouts sejam uma característica do objeto janela, vamos cobri-los no capítulo de Timeouts JavaScript, em vez de Neste capítulo.

Conteúdo

Referenciando o Objeto window do JavaScript

Como abrangida no Objecto de JavaScript Básico geralmente é necessário o uso de notação de ponto ao acessar propriedades ou métodos de um objeto. Por exemplo, o seguinte fragmento de script acessa o método write() do objeto de documento:

document.write("Hello");

O objeto de janela é o objeto de nível superior da hierarquia de objetos. Como tal, sempre que um método de objeto ou propriedade é referenciado em um script sem o nome do objeto e prefixo do ponto, ele é assumido por JavaScript para ser um membro do objeto janela. Isto significa, por exemplo, que ao invocar o método de alerta de janela() para mostrar uma janela de alerta a janela. o prefixo não é obrigatório. Portanto, o seguinte método chama alcançar a mesma coisa:

window.alert();alert()
Ezoicrelatório este anúncio

JavaScript janela de Propriedades do Objecto

O JavaScript objeto de janela contém um número de propriedades que pode ser inspecionado e utilizado em um script:

  • a janela.fechado-usado ao manusear várias janelas, esta propriedade indica se uma janela foi fechada ou não.
  • janela.defaultstatus / window.status-defaultstatus indica a mensagem por omissão mostrada na barra de Estado do navegador. o status especifica uma mensagem temporária para mostrar na barra de Estado do navegador no lugar do padrão. Desactivado em muitos navegadores.
  • janela.frames-se a janela contém frames, esta lista contém a lista de objectos de frame (ver Arrays de JavaScript sobre o acesso a arrays).
  • window.name -as janelas abertas por um script devem ter um nome. Esta propriedade contém o nome do objecto da janela correspondente.

  • janela.opener-quando uma janela foi aberta num programa contido noutra janela, esta propriedade da janela-filha contém uma janela de referência que a abriu.
  • janela.pai-ao trabalhar com os quadros numa janela esta propriedade contém uma referência ao objecto da janela que contém a moldura.
  • janela.screen-um objeto que contém informações sobre a tela na qual a janela é exibida (as propriedades contidas neste objeto incluem altura, largura, disponibilidade, availewidth e colorDepth).
  • janela.auto-uma referência à janela actual.
  • janela.top-uma referência à janela de nível superior quando se trabalha com quadros.

abrir janelas de navegador usando JavaScript

uma nova janela de navegador pode ser aberta a partir de um script JavaScript usando o método open() do objeto janela. A sintaxe para abrir uma nova janela é a seguinte:

newWindowObj = window.open("URL", "WindowName", "feature, feature, feature ... ");

o seguinte fornece uma explicação dos argumentos passados ao método open ():

  • URL – especifica o URL da página web a ser carregado na nova janela. Se não for indicado nenhum URL, é carregada uma janela em branco.
  • WindowName-especifica o nome da janela e é usado para se referir à janela.
  • funcionalidades-uma lista separada por vírgulas de funcionalidades que lhe permitem personalizar a aparência da janela. As opções são::

Configuração Explicação
largura Especifica a largura inicial do seu navegador da janela do cliente (ver innerWidth para o tamanho da área de conteúdo)
altura Especifica a altura inicial do seu navegador da janela do cliente (consulte download para o tamanho da área de conteúdo)
innerWidth Especifica a largura inicial da janela de área de conteúdo
download Especifica a altura inicial da janela de conteúdo área
outerWidth Especifica a largura inicial da janela do navegador
outerHeight Especifica a altura inicial da janela do navegador
barra de ferramentas Especifica se a janela deve conter a barra de ferramentas do navegador ou não
estado Especifica se a janela deve conter a barra de status do navegador ou não
dependentes Especifica se a janela deve fechar-se em uníssono com a sua janela principal
menu Especifica se a janela deve conter o navegador de menus
localização Especifica se a janela deve conter a localização do navegador/caixa de URL
barras de rolagem Mostra/Esconde navegador horizontal/vertical barras de rolagem
redimensionável Especifica se o usuário tem o direito de redimensionar a janela depois que ele aparece.
diretórios especifica se a janela deve conter a barra de ferramentas pessoal do navegador.
copyHistory Especifica se a nova janela deve conter uma cópia do histórico da URL do invocando janela
esquerda Especifica o número de pixels do lado esquerdo da tela para a nova janela
top Especificado o número de pixels a partir do topo do ecrã para a nova janela
alwaysLowered Cria uma nova janela que está sempre posicionado sob as outras janelas do navegador. Muitas vezes usado para aqueles anúncios pop-under irritantes.
alwaysraized cria uma nova janela que está sempre posicionada sobre o topo das outras janelas do navegador na tela.
z-lock bloqueia o nível em que o navegador aparece em relação a outras janelas do navegador.

as características de altura, largura e posição são definidas usando números. As opções restantes do recurso podem ser definidas usando valores true ou false (também sim, não e 1 e 0 podem ser usados no lugar de true E false). Um atributo ausente é considerado falso. O exemplo seguinte cria uma nova janela com um menu, dimensão específica e sem barra de Ferramentas:

newWindowObj = window.open("URL", "WindowName", "toolbar=0, menubar=1, innerHeight=200, innerWidth=300");

fechar janelas de navegação usando JavaScript

uma janela pode ser fechada usando o método de fecho do objeto da janela (). O nome da janela (especificado no Método open ()) deve ser referenciado ao executar uma aproximação de modo que você tenha certeza de fechar a janela correta. Por exemplo, o seguinte código cria uma nova janela e cria um pushbutton que, quando carregado, fecha a nova janela:

<script language="JavaScript" type="text/javascript">newWindowObj = window.open ("", "MyWindow");</script><form action="null"> <input type="button" value="Close Window" onclick="newWindowObj.close()" /></form>

também é possível fechar a janela que abriu a janela atual usando o abridor de propriedade da janela atual objeto:

window.opener.close()

Isto irá fechar a janela que abriu a janela na qual o script acima é executado.

mover e redimensionar as janelas

uma janela pode ser movida para coordenadas específicas na tela usando o método moveTo() do objeto da janela que leva as coordenadas x e y como argumentos. O exemplo seguinte move uma nova janela para a localização 100, 200 no ecrã quando o botão “Mover a janela” é pressionado:

além de mover uma janela para uma nova localização específica também é possível mover uma janela em relação à sua localização atual no ecrã usando o método moveBy() do objeto da janela JavaScript. Mais uma vez, o método leva os valores x e y que são adicionados às coordenadas X e y atuais da janela especificada. Os valores negativos podem ser usados para mudar a direção do movimento:

<script language="JavaScript" type="text/javascript">newWindowObj = window.open ("", "MyWindow");</script><form action="null"> <input type="button" value="Move Window" onclick="newWindowObj.moveTo(100, 200)" /></form>

A janela resizeTo() e resizeBy() métodos funcionam da mesma forma em que eles permitem que você alterar o tamanho de uma janela para um tamanho específico, ou para um novo tamanho em relação ao tamanho atual.

mudar o foco da janela

quando uma janela é a janela seleccionada de momento no ecrã, diz-se que tem o foco. Normalmente, se carregar com o cursor do rato numa janela, dá-lhe o foco da janela. Com JavaScript é possível alterar programaticamente o foco de uma janela usando os métodos de foco() e borrão (). O exemplo a seguir exibe uma nova janela, confunde-lo para que a janela de abertura ainda tem o foco e fornece um botão para alternar o foco para a nova janela:

<script language="JavaScript" type="text/javascript">newWindowObj = window.open ("", "MyWindow");newWindowObj.blur();</script><form action="null"> <input type="button" value="Focus New Window" onclick="newWindowObj.focus()" /></form>

Apresentar a Caixa de Mensagem de caixas de diálogo

O JavaScript objeto de janela fornece métodos para apresentar três tipos de caixas de diálogo de mensagem, o de alerta, de confirmação e de prompt de caixas de diálogo:

  • alerta – destina-se a exibir uma mensagem para o usuário. Ele contém uma área de mensagem onde a mensagem de alerta deve ser exibida e um botão” OK ” que o usuário pode clicar para descartar a janela. O método alert () leva um único argumento que representa a mensagem a ser mostrada na janela. O fragmento da página web seguinte mostra uma janela de alerta com a mensagem “Você não tem uma senha válida” quando o botão “Mostrar alerta” é clicado:
<form action="null"> <input type="button" value="Show Alert" onclick="window.alert('You do not have a valid password')" /></form>
  • confirmação – usado quando é necessário obter uma resposta sim ou não do utilizador. Este tipo de janela mostra com uma mensagem e botões “OK” e “cancelar”. O método confirm () leva a mensagem a ser mostrada ao Utilizador como um argumento e devolve verdadeiro ou falso, dependendo se o utilizador carregou em “OK” ou “cancelar”:
<script language="JavaScript" type="text/javascript">function showConfirmation(){ var result = confirm("Would you like to continue?"); if (result) document.write("Continue"); else document.write("Do not continue");}</script><form action="null"> <input type="button" value="Show Confirmation" onclick="showConfirmation()" /></form>
  • prompt – desenhado para permitir que a informação seja obtida do utilizador. A janela consiste em uma mensagem para o usuário, um campo de entrada de texto para a entrada de dados e botões OK e cancelar. O método prompt () pega na mensagem para ser mostrada como argumento e devolve o valor introduzido pelo utilizador:
<script language="JavaScript" type="text/javascript">function showPrompt(){ var userInput = prompt("Please enter your name:"); document.write("Hello, " + userInput);}</script><form action="null"> <input type="button" value="Show Prompt" onclick="showPrompt()" /></form>

Comprar e descarregar a versão PDF completa deste JavaScript eBook por apenas r $8.99

Previous Table of Contents Next
JavaScript Math Object JavaScript Document Object

Deixe uma resposta

O seu endereço de email não será publicado.