第十六章 HTML5指令碼程式設計

2021-10-01 10:34:53 字數 2149 閱讀 4114

一、跨文件訊息傳遞

關於跨文件訊息傳遞,其本質而言是自己利用自己的方法給自己傳遞訊息,只是這個傳遞的動作是在另外乙個window物件中

1)、定義

跨文件訊息傳遞指的是在乙個視窗中,不同內嵌的框架(iframe)傳遞訊息

2)、contentwindow屬性(相關api介紹)

其內嵌框架的乙個**window物件,既然是**,就說明它只含有某些方法和屬性,並不是正真window物件的完整副本

3)、postmessage和onmessage事件

postmessage事件用於傳送訊息,在傳送訊息方框架使用,但是卻作用與接受訊息框架的**window物件上(這就是為什麼說是自己利用自己的方法給自己傳遞訊息)。存在兩個引數,第乙個引數為需傳遞的資料,型別為string;另外乙個表明獲取訊息內嵌框架的域(window.origin),預設允許全部為'*'

onmessage事件用於接收資訊,在內嵌框架中使用,其事件處理程式物件(event)中包含三個引數。data(所需接受的資料),origin(傳送方框架所在的域)和source(傳送框架的**window物件)

4)、示例:

postmessage.html

<

!doctype html>

"en"

>

"utf-8"

>

"viewport" content=

"width=device-width, initial-scale=1.0"

>

"x-ua-compatible" content=

"ie=edge"

>

document<

/title>

<

/head>

parent<

/div>

"clickfun()"

>parentsend<

/button>

"file:///c:/users/30863/desktop/native-test/postmessagechild.html" frameborder=

"0">

<

/iframe>

<

/body>

const child = document.

getelementsbytagname

('iframe')[

0]function

clickfun()

window.

addeventlistener

('message'

,function

(e))

<

/script>

<

/html>

postmessagechild.html

<

!doctype html>

"en"

>

"utf-8"

>

"viewport" content=

"width=device-width, initial-scale=1.0"

>

"x-ua-compatible" content=

"ie=edge"

>

document<

/title>

<

/head>

child<

/div>

<

/body>

window.

addeventlistener

('message'

,function

(e))

<

/script>

<

/html>

二、原生拖放

1)、拖放事件

2)、自定義放置目標

3)、datatransfer物件

4)、dropeffect和effectallowed

5)、draggable屬性

三、**元素

linux shell程式設計指南第十六章

乙個s h e l l指令碼可以包含乙個或多個命令。當然可以不必只為了兩個命令就編寫乙個s h e l l 指令碼,一切由使用者自己決定。s h e l l指令碼可以在行命令中接收資訊,並使用它作為另乙個命令的輸入。指令碼不是複雜的程式,它是按行解釋的。指令碼第一行總是以 b i n s h開始,這...

高程3總結 第16章HTML5指令碼程式設計

dropeffect屬性只有搭配effectallowed屬性才有用,effectallowed屬性表示允許拖動元素的哪種dropeffect,effectallowed屬性可能的值如下 取得元素的引用 var player document.getelementbyid player btn do...

UNP UNIX網路程式設計 第十六章 非阻塞式I O

套接字預設狀態是阻塞的。也就是說當發出乙個不能立即完成的套接字呼叫時,程序將被投入睡眠,等待相應操作的完成 一般分為四類 1.輸入操作 包括read readv recv recvfrom recvmsg這5個函式。當套接字緩衝區沒資料可讀時,程序將被投入睡眠狀態,直到有資料可達。2.輸出操作 包括...