Topicos Internet b Dom Window

Tópicos avançados em internet B

Carlos Oberdan Rolim

Ciência da Computação

DOM

Objeto Window

Objeto window

Top level na hierarquia JS

Representa uma janela do browser

Um novo objeto windows é criado automaticamente a cada tag <body> <frameset>

Propriedades

Closed

Retorna um booleano especificando se a janela foi fechada

Sintaxe: window.closed

Exemplo:

function checkWin() {

if (myWindow.closed) ifClosed() else ifNotClosed() }

Propriedades

defaultStatus

Define ou retorna o texto padrão da status bar de uma janela

Sintaxe:

window.defaultStatus=sometext

Exemplo:

<script type="text/javascript"> window.defaultStatus="This is the default text in the status bar!!" </script>

Propriedades

name

Define ou retorna o nome da janela

Sintaxe:

window.name=name

Exemplo:

function checkWin() { document.write(myWindow.name) } </script>

Propriedades

opener

Retorna uma referência para a janela que criou a corrente

Sintaxe:

window.opener

Exemplo:

<script type="text/javascript"> myWindow=window.open('','MyName','width=200,height=100')

myWindow.document.write("This is 'myWindow'")

myWindow.focus()

myWindow.opener.document.write("This is the parent window")

</script>

Propriedades

outerheight

Retorna ou define a altura externa de uma janela incluindo todos seus elementos

Sintaxe:

window.outerheight=pixels

Exemplo:

<script type="text/javascript">

myWindow=window.open('','')

myWindow.outerheight="100"

myWindow.outerwidth="100"


myWindow.focus()

</script>

Propriedades

outerwidth

Retorna ou define a largura externa de uma janela incluindo todos seus elementos

Sintaxe:

window.outerwidth =pixels

Exemplo:


myWindow=window.open('','')

myWindow.outerheight="100"

myWindow.outerwidth="100"


myWindow.focus()

</script>

Propriedades

pageXOffset

Define ou retorna a posição X corrente da página em relação ao canto superior esquerdo da área visível da janela

Propriedades

pageyOffset

Define ou retorna a posição Y corrente da página em relação ao canto superior esquerdo da área visível da janela

Propriedades

parent

Retorna a janela pai

Propriedades

scrollbars

Define se scrool bars devem estar visíveis ou não

Propriedades

top

Retorna a janela ao top (topmost ancestor window)

Propriedades

self

Retorna uma referência para a janela corrente

Sintaxe:

window.self

Exemplo:

function breakout() {

if (window.top!=window.self) {

window.top.location="tryjs_breakout.htm"

}

}

</script>

Propriedades

status

Define ou retorna o

Sintaxe:

window.status=sometext

Exemplo:


window.status="Some text in the status bar!!"

</script>

Propriedades

statusbar

Define se o browser deve mostrar ou não a status bar

Métodos

alert()

Mostra um alert box

Sintaxe:

alert(message)

Exemplo:

function display_alert() {

alert("I am an alert box!!")

}

Métodos

blur() e focus ()

Remove (blur) e coloca (focus) o foco da janela corrente

Sintaxe:

window.blur ou window.focus

Exemplo: (faz com que a janela perca o focus)


myWindow=window.open('','','width=200,height=100')


myWindow.blur() // ou poderia ser usado myWindow.focus()

</script>

Métodos

setInterval()

Executa uma função em determinado intervalo de tempo até que clearInterval seja chamado ou a janela fechada

Sintaxe:

setInterval(code,millisec[,"lang"])

Exemplo: (atualiza o contador a cada 50 milisegundos mostrando a data)<input type="text" id="clock" size="35" /> <script language=javascript> var int=self.setInterval("clock()",50) function clock() { var t=new Date() document.getElementById("clock").value=t } </script> </form>

Métodos

clearInterval()

Cancela o intervalo definido por setInterval

Sintaxe:

clearInterval(id_of_setinterval)

Exemplo:

<input type="text" id="clock" size="35" /> <script language=javascript> var int=self.setInterval("clock()",50) function clock() { var t=new Date() document.getElementById("clock").value=t } </script> </form> <button onclick="int=window.clearInterval(int)"> Stop interval</button>

Métodos

setTimeout()

Executa uma função após um intervalo de tempo

Sintaxe:

setTimeout(code,millisec,lang)

Exemplo: (mostra um alert 5 segundos após clicar no botão)

function timedMsg() { var t=setTimeout("alert('5 seconds!')",5000) }

......

<input type="button" value="Display timed alertbox!" onClick="timedMsg()">

Métodos

clearTimeout()

Cancela o setTimeout

Sintaxe:

clearTimeout(id_of_settimeout)

Métodos

Close

Fecha janela corrente

Confirm

Mostra uma janela de confirmação

Prompt

Mostra uma prompt window

Métodos

createPopup()

Cria uma popup

Sintaxe

Exemplo:

function show_popup() { var p=window.createPopup() var pbody=p.document.body pbody.style.backgroundColor="lime" pbody.style.border="solid black 1px" pbody.innerHTML="This is a pop-up! Click outside to close.“ p.show(150,150,200,50,document.body) }

Métodos

moveBy()

Move a janela x pixels de acordo com a posição corrente

Sintaxe:

window.moveBy(x,y)

Exemplo:

function moveWin() { myWindow.moveBy(50,50) }......myWindow=window.open('','','width=200,height=100') myWindow.document.write("This is 'myWindow'") ....<input type="button" value="Move 'myWindow'" onclick="moveWin()" />

Métodos

moveTo()

Move uma janela para determinada posição (referência canto superior esquerdo)

Sintaxe:

window.moveTo(x,y)

Exemplo:

function moveWin() { myWindow.moveTo(50,50) }......myWindow=window.open('','','width=200,height=100') myWindow.document.write("This is 'myWindow'") ....<input type="button" value="Move 'myWindow'" onclick="moveWin()" />

Métodos

open()

Abre uma nova janela

Sintaxe:

window.open(URL,name,specs,replace)

URL = endereço a abrir

name = (opcional) Especifica o nome alvo da janela. Pode ser usado _blank, _parent, _self, _top ou nome da janela

specs = (opcional) Lista de atributos da janela separado por virgulas width=pixels, height=pixels, top=pixels, left=pixels, scrollbars=yes,status=no, resizable=no

replace = (opcional) define se a url da janela criada deve substituir a history list ou não. Valores true ou false

Métodos

print()

Imprime (na impressora) a janela corrente

Sintaxe:

window.print()

Métodos

scrollTo()

Rola o conteúdo até determinada coordenada

Sintaxe:

scrollTo(xpos,ypos)

Exemplo:

function scrollWindow() {

window.scrollTo(100,500)

}

Objeto document

Objeto document

Representa todo o documento html

É parte do objeto window

Acessado através da propriedade window.document

Coleções

Anchors[]

Retorna referência para todos objetos anchors

Forms[]

Retorna referência para todos objetos forms

Images[]

Retorna referência para todos objetos images

Links[]

Retorna referência para todos objetos link e map areas

Exemplo

document.write(document.images.length)

Propriedades

cookie

Retorna ou define cookies associado ao documento

domain

Retorna o dominio do documento

lastModified

Retorna data e hora que o documento foi alterado

referrer

Retorna a url que carregou o documento corrente

title

Retorna o titulo do documento corrente

url

Retorna a url do documento corrente

Métodos

close()

Fecha o stream aberto com document.open e mostra o conteúdo

getElementById()

Retorna referência para primeiro objeto definido pelo id especificado

getElementsByName

Retorna uma coleção de objetos com o nome especificado

getElementsByTagName

Retorna uma coleção de objetos com a tag name especificada

open()

Abre stream para receber dados de document.write ou document.writeln

write()

Escreve na stream

writeln()

Objeto location

Objeto location

É parte do objeto window

Acessado através da propriedade window.location

Propriedades

host

Retorna o hostname e a porta da url corrente

hostname

Retorna o hostname da url corrente

href

Define ou retorna a url corrente

Usado para enviar o usuário a uma nova url

Exemplo:

window.location.href="http://www.novaurl.com.br";

(window.location é um “atalho” para window.location.href)

Objeto history

Objeto history

Faz parte do objeto window

History consiste em um array de URLs visitadas

Acessado através da propriedade window.history

Propriedades

length

Retorna o número de elementos no histórico

Métodos

back

Lê a URL anterior do histórico

forward

Lê a próxima URL do histórico

go

Lê uma URL específica do histórico

Documents

Topicos Internet b Dom Window