iFrames jau sen ir HTML standarta sastāvdaļa. HTML 4.0 laikā tās tika iekļautas kopā ar tagadējiem novecojušajiem rāmjiem rāmju HTML versijā. Rāmji HTML5 vairs netiek ņemti vērā, bet iegultie rāmji (iFrames) joprojām.
Ar iFrames ir iespējams iegult citus tīmekļa vietnes. Pārlūks tādējādi atveido citu HTML failu iekšējā pašreizējā vietnē. iFrame loga saturu var individuāli formatēt.
Runājot par iFrames, ir svarīgi vēlreiz īpaši apsvērt šī HTML tehnoloģija drošību. Šeit problēmu rada kaitīgs kods, kas var tikt neievērojami ievietots tīmekļa vietnēs, izmantojot iFrames. Protams, tas ir milzīgs ļaunums.
Tomēr HTML5 piedāvā attiecīgus drošības mehānismus, lai novērstu šīs problēmas. Par šo vairāk tiks teikts turpmākajā šī pamācības gaitā. Pirms iFrame izmantošanas tomēr jāapsver, ka tie potenciāli rada draudus, it īpaši tāpēc, ka jaunie drošības atribūti vēl joprojām nav atbalstīti visos pārlūkprogrammos.
HTML5 iFrames ir pastāvīgs standarts un ienes vairākus papildu atribūtus. Nākamais piemērs parāda, kā definēt iFrames.
<iframe src="http://www.psd-tutorials.de/" width="420" height="350"> <a href="http://www.psd-tutorials.de/">PSD-Tutorials.de</a> </iframe>
Pārlūkā rezultāts izskatās šādi:
iframe
-elementam tiek piešķirts src
-atribūts. Šis src
satur vērtību, kuru vietni parādīt. Tas var būt gan lokāls fails. Tomēr iespējams arī – tāpat kā redzamajā piemērā – izsaukt ārējo resursu.
Ar abiem atribūtiem width
un height
tiek nosūtīti iFrame platums un augstums. Ja iekļautais saturs ir lielāks par iFrame norādīto izmēru, tiks parādītas ritjoslas.
Starp atvērtām un aizvērtām <iframe>
-tagiem var definēt dažādus saturus. Tomēr tos var redzēt tikai tādos pārlūkprogrammās, kas nesaprot iframe
-elementu.
HTML5 iFrames ievieš vairākus jaunus atribūtus, kas lielākoties saistīti ar tā dēvēto smilšu kastes uzvedību.
Pārlūkos Same Origin Policy nodrošina, ka iegultā vietne savas rādīšanas laikā nevar tikt manipulēta. Šī drošības funkcija ir samērā noderīga. Tomēr tā nav vienmēr ideāla. Tāpēc HTML5 tika ieviests sandbox
-atribūts, kas pārlūkiem skaidri norāda, kādas tiesības jāpiešķir no ārējās vietnes iFrame iekļautā saturā.
<iframe sandbox="allow-forms" src="getusercontent.cgi?id=12193"> </iframe>
iFrames, kas ietilpst ar sandbox
-atribūtu, nevar piekļūt iegultās vietnes DOM. Turklāt tām nav atļauts izpildīt skriptus un saglabāt sīkdatnes. Šīs ierobežojumus var izņemt, lietojot dažādus inguņus.
<iframe sandbox="allow-same-origin" src="http://www.psd-tutorials.de/"> </iframe>
Bet jūs varat piešķirt arī vairākus inguņus. Tos attiecīgi jāatdala ar tukšumu. Atkal šeit ir piemērs:
<iframe sandbox="allow-same-origin allow-forms allow-scripts" src="http://www.psd-tutorials.de/"> </iframe>
iFrames parasti ir paredzēti ārējo satura ietvēršanai. Tomēr tos var arī iekļaut.
<iframe src="http://www.psd-tutorials.de/" width="200" height="150" seamless> </iframe>
Šim atribūtam ir diezgan nozīmīga ietekme. Tātad ietvertā dokumenta hipersaites mērķis – ja nav definēts pretējais – tiek parādīts pārlūka logā, kur tika definēts iframe
-elements (parasti ietvertās lapas hipersaites – ja nav citas definīcijas – tiek parādītas iFrame logā).Seamless
pagaidām atbalsta tikai Google Canary, šī pārlūkprogrammas attīstības versija.
Cits efekts attiecas uz stilu lapām. Šīs ietveramās faila stilu lapas attiecas arī uz iekļautu dokumentu. (Parasti ietvertā faila stilu norādes tomēr nedarbojas).
Ir pievienots arī cits atribūts. Ar srcdoc
var tieši definēt ietveramo saturu. Apskatiet šo piemēru:
<iframe sandbox="allow-same-origin allow-forms allow-scripts" seamless="seamless" srcdoc=" <script> top.location.href=" http://www.psd-tutorials.de/" </script>"> </iframe>
Šajā gadījumā trūkst src
-atribūts, kurā parasti norāda failu, kas jāiekļauj.
Saturu, kas norādīts ar srcdoc
, tiek apstrādāts kā no sveša servera nākušs. Tādējādi tas pilnā mērā pakļauts "Savs avots" politikai. Šāda uzvedība ir interesanta, piemēram, skriptu definīciju kontekstā. Tajā ir atļauta jebkura HTML un JavaScript koda ievietošana. Tomēr pēdiņas un "AND" simbols ir jāapraksta ar nosauktajiem simboliem "
un &
.
Jūs šeit varat definēt lapu tieši un attiecīgi iegūt vēlamo saturu.
<iframe sandbox="allow-same-origin allow-forms allow-scripts" seamless="seamless" srcdoc="<!DOCTYPE html> <html> <head> <title>PSD-Tutorials.de</title> </head> <body> <p>…</p> </body> </html>"> </iframe>
Arī tas nav jāuztver kā pilnu HTML failu. Tādējādi ir iespējams ievietot arī tādu saturu kā šis:
<iframe sandbox="allow-same-origin allow-forms allow-scripts" seamless="seamless" srcdoc="<p>PSD-Tutorials.de</p>"> </iframe>
Pārlūkprogrammā tas izskatās šādi:
Tātad tas ir pilnīgi normāls HTML sintakse, bez skriptiem utt.
Vēl daži norādījumi par atribūtiem, kas līdz šim ir tikuši izmantoti vizuālajai noformēšanai: lietas kā scrolling, marginwidth
un marginheight
HTML5 vairs nav atļautas. Šos atribūtus aizstāj ar CSS.