A legtöbben nincsenek tisztában azzal, hogy fejlesztői eszközök kincsesbánya állnak a rendelkezésére, és ez el van rejtve kedvenc böngészőjében.
Minden webböngésző fejlesztői eszközöket kínál a webhely kódolásának ellenőrzéséhez. Ez azonban egy külföldi entitás az átlagos internetfelhasználó számára. Végül is ki akarja megnézni egy webhely kódolását, igaz?
Mint kiderült, rengeteg dolgot tanulhatsz meg, ha megnézed a webhely kódolását. Olvasson tovább, hogy megtudja, mit kínál az elemellenőrzési funkció, és hogyan kell használni.
A legtöbb böngésző rendelkezik eszközökkel a webhely elemeinek ellenőrzésére, de általában mindegyik ugyanúgy működik.
Az Inspect Element használata a Google Chrome-ban
- Nyissa meg az ellenőrizni kívánt webhelyet.
- Kattintson a jobb gombbal az oldal tetszőleges pontjára, és válassza a Vizsgálat lehetőséget.
VAGY - Kattintson a három függőleges pontra az eszköztár jobb sarkában.
- Lépjen a További eszközök oldalra.
- Válassza a Fejlesztői eszközök lehetőséget.
VAGY - Nyomja meg az F12 billentyűkódot PC-n (vagy a CMD + Options + I billentyűt Macen.)
Az Inspect Element használata a Microsoft Edge-ben
- Nyisson meg egy webhelyet.
- Kattintson a három függőleges pontra a böngésző eszköztárának jobb felső sarkában.
- Görgessen le, és kattintson a További eszközök elemre.
- Kattintson a Fejlesztői eszközök elemre.
VAGY - Kattintson a jobb gombbal bárhol a webhelyen, és kattintson a Vizsgálat elemre.
VAGY - Nyomja meg a Ctrl + Shift + I billentyűket.
A három módszer bármelyike ugyanazt az eredményt adja.
Ha ezt helyesen tette, egy új ablaktábla nyílik meg a böngésző alján. Ezek a Fejlesztői eszközök, és magukban foglalják az Elemek lapot. Ez az az eszköz, amelyre szüksége van az elem ellenőrzéséhez.
A panel alapértelmezés szerint a képernyő alján nyílik meg, de bármikor módosíthatja a megjelenését. Kövesse az alábbi egyszerű lépéseket a Fejlesztői eszközök panel áthelyezéséhez:
- Kattintson a három vízszintes pontra a Fejlesztői eszközök panel felső sarkában.
- Válasszon ki egy dokkolóoldalt (balra, alulra vagy jobbra), vagy csatlakoztassa le egy külön ablakhoz.
Ha a kurzort a Fejlesztői eszközök panel keretének széle mellé viszi, és húzza, szűkíti vagy szélesíti a munkaterületet. Ha például úgy dönt, hogy a panelt a böngészőablak jobb oldalához rögzíti, próbálja meg a bal oldali szegélyre mutatni. A nyíl kurzor láttán átméretezheti a panelt húzással.
Az Inspect Element használata (OS-specifikus)
Bár sok lépést lefedhetett volna az Inspect Element böngészőben való használatának bemutatása, a legtöbb operációs rendszeren mégis megmutatjuk, hogyan.
Az Inspect Element használata Chromebookon
A Chromebookok alapértelmezett böngészője a Google, ezért kövesse a Chrome böngésző utasításait az Inspect Element eléréséhez. Íme egy kis frissítő tanfolyam számodra:
- Nyisson meg egy webhelyet.
- Kattintson a három függőleges pontra az eszköztár jobb felső sarkában.
- Válassza a További eszközök lehetőséget.
- Kattintson a Fejlesztői eszközök elemre.
A Fejlesztői eszközök gyorsabb eléréséhez használhatja a jobb egérgombos módszert vagy az F12 funkcióbillentyűt is.
Az Inspect Element használata Android-eszközön
Az Inspect Element futtatása Android-eszközön kissé eltér. Nézze meg, hogyan juthat el az Inspect Element panelhez Androidon:
- Nyomja meg az F12 funkcióbillentyűt.
- Válassza az Eszköztár váltása lehetőséget.
- Válassza ki az Android-eszközt a legördülő menüből.
Amikor kiválaszt egy adott Android-eszközt, észre fogja venni, hogy a webhely mobil verziója töltődik be. Innentől szabadon használhatja az Inspect Element funkciót Android-eszközén az asztali számítógépéről.
Ez a módszer a Chrome és a Firefox böngészők esetében is működik, mivel ezeknek a Fejlesztői Eszközökben van egy Device Simulation nevű funkciója.
Ugyanígy működik az iPhone készülékeknél is. Csak ki kell választania a megfelelőt a legördülő menüből.
Az Inspect Element használata Windows rendszerben
Az Inspect Element eszköz nem feltétlenül operációs rendszer-specifikus, de böngésző-specifikus. Ez azt jelenti, hogy a Fejlesztői eszközök az Ön által használt böngésző funkciói, nem feltétlenül a Windows. Az Elem vizsgálata panelt azonban attól függetlenül elérheti, hogy melyik böngészőt részesíti előnyben.
Ha Windows operációs rendszert használ, akkor valószínűleg a Microsoft Edge böngészőt is használja. Nézze meg, hogyan érhető el az Inspect Element az MS Edge rendszeren:
- Nyissa meg az ellenőrizni kívánt webhelyet.
- Érintse meg a három függőleges pontot a böngészőablak sarkában.
- Görgessen le, és válassza a További eszközök lehetőséget.
- Kattintson a Fejlesztői eszközök elemre.
Az F12 funkcióbillentyűt is használhatja az Inspect Element gyorsabb eléréséhez. Ezenkívül működik a jobb gombbal a weboldalra való kattintás és a Vizsgálat kiválasztása is.
Az Inspect Element használata Mac-en
Ha Mac számítógépet használ, valószínűleg a Safari böngészőt választja. Az Inspect Elements megnyitása Safariban némileg eltér a Chrome-tól és a Firefoxtól. De ez ugyanolyan egyszerű az alábbi lépésekkel:
- Nyissa meg a Safari böngészőt.
- Kattintson a Safari elemre a fejléc lapon, és válassza a Beállítások lehetőséget a legördülő menüből.
- Kattintson a képernyő tetején található Speciális fogaskerék ikonra.
- Jelölje be a Fejlesztési menü megjelenítése a menüsorban jelölőnégyzetet.
Ezen lépések végrehajtásával engedélyezi az Elem vizsgálata funkciót a böngészőjében. Ha először nem engedélyezi az Inspect Element funkciót, akkor nem fogja látni a lehetőséget, amikor megnyit egy webhelyet.
Miután befejezte ezt a lépést, egyszerűen kattintson a jobb gombbal bármelyik megnyitott weboldalra, és válassza a Vizsgálat lehetőséget. Használhatja a gyorsbillentyűk parancsát is: CMD + Option + I (ellenőrzés).
Az Inspect Element használata iOS rendszeren
Szeretné használni az Elemek vizsgálata funkciót, hogy megnézze, hogyan jelenik meg egy weboldal mobil verziója iPhone-on? Ezt és még sok mást megtehet néhány egyszerű lépéssel. Mielőtt azonban megnézne egy elemet, engedélyeznie kell a Web Inspector alkalmazást iOS-eszközén:
- Menj a beállításokhoz.
- Most válassza a Safari lehetőséget.
- Görgessen le, és érintse meg a Speciális menüt.
- Most érintse meg a váltókapcsolót a Web Inspector bekapcsolásához.
Győződjön meg arról is, hogy a Fejlesztés menü engedélyezve van a Mac számítógépen a fenti szakasz lépéseit követve.
Az iOS mobileszközök és a Mac számítógépek engedélyezése után a Fejlesztés menü jelenik meg a Mac számítógép felső sávjában. Kattintson rá a csatlakoztatott iPhone és az eszközön aktív weboldal megtekintéséhez. A weboldal kiválasztásával megnyílik egy Web Inspector ablak is ugyanannak az oldalnak a Mac képernyőjén.
Ne feledje azonban, hogy ezek az útmutatások csak Mac gépen futó Safari esetén működnek, Windows rendszeren futó Safari esetén nem.
Az Inspect Element használata blokkolt állapotban
Időnként azt tapasztalhatja, hogy nem tud megvizsgálni egy weboldalt, és az Ellenőrzés lehetőség szürkén jelenik meg, ha megpróbál rákattintani a jobb gombbal. Lehet, hogy azt gondolja, hogy blokkolva van, de számos mód van ennek elkerülésére:
1. módszer – Kapcsolja ki a Javascriptet
- Lépjen a Beállításokba.
- Keresés JavaScript.
- Kapcsolja ki a JavaScriptet.
2. módszer – A fejlesztői eszközök hosszú távú elérése
Ahelyett, hogy az egér jobb gombjával kattintana az Ellenőrzéshez, tegye a következőket:
- Nyissa meg a Beállításokat a böngészőjében.
- Válassza a További eszközök lehetőséget.
- Görgessen le, és kattintson a Fejlesztői eszközök elemre.
3. módszer – A funkcióbillentyű használata
Kipróbálhatja az F12 funkcióbillentyűt is olyan weboldalakon, amelyek blokkolják a jobb gombbal történő kattintást az Inspect funkcióhoz.
Előfordulhat, hogy mindegyik módszert ki kell próbálnia, mielőtt rátalálna az Ön számára megfelelőre. Végső megoldásként megpróbálhatja megnézni a forráskódot a view-source parancs beírásával: [enter full url].
Az Inspect Element használata iskolai Chromebookon
Ha Chromebookját egy iskola adta ki, az Elem vizsgálata funkció néhány egyszerű lépésből áll:
- Kattintson a jobb gombbal vagy érintse meg két ujját a weboldalon, és válassza a Vizsgálat lehetőséget.
- Nyomja meg a Ctrl + Shift + I billentyűket.
- Próbálja ki és használja a nézetforrást:[url] módszer, például view-source: https://www.wikipedia.com.
Egyes iskolák és szervezetek azonban letiltják ezt a funkciót, így ha nem működik az Ön számára, előfordulhat, hogy kapcsolatba kell lépnie a szervezetével vagy az iskolai rendszergazdával.
Az Inspect Element használata válaszok keresésére
Az Inspect Element segítségével számos dologra választ találhat, például:
- Webhelyterv előnézete mobileszközökön.
- Ismerje meg a versenytársak által használt kulcsszavakat.
- Sebesség tesztek.
- Szöveg módosítása egy weboldalon.
- Keressen gyors példákat, amelyek megmutatják a fejlesztőknek, mire van szüksége.
Amikor elindítja az Elem vizsgálata panelt, látni fogja a webhely összes kódolását. Ez magában foglalja az összes beépített JavaScript-, CSS- és HTML-kódolást. Ez olyan, mintha egy weboldal forráskódját látná, kivéve, hogy módosíthatja a kódot. Ezenkívül valós időben láthatja a végrehajtott változtatásokat.
Ez az eszköz felbecsülhetetlen értékűvé teszi a marketingesek, a tervezők és a fejlesztők számára, hogy megtekintsék a tervezési változtatásokat, mielőtt azokat véglegesítenék. Az Inspect Element kódolási módosítások azonban nem tartanak örökké. Az oldal újratöltésekor visszaáll az alapértelmezett állapotba.
További GYIK
Ha a fenti elolvasása után nem szakértője az Inspect Elementnek, itt további válaszokat talál.
Hogyan használhatom az Inspect Element parancsot válaszok kereséséhez?
Az Elem vizsgálata funkcióval az egyetlen módja annak, hogy választ találjon, ha a webhely a beküldés után azonnal felfedi. Ebben az esetben a válaszok jelen vannak a kódolásban.
Ellenkező esetben egyszerűen megtekinti a kvíz vagy teszt kódját, amikor az Elem vizsgálata funkciót használja, valamint a beküldött válaszokat.
Az Inspect Element illegális?
Nem, az Inspect Element eszköz nem illegális; webfejlesztőknek készült. Egy webhely forráskódjának megtekintése nem illegális; ez csak akkor válik problémássá, ha az összegyűjtött információkat aljas célokra használja fel, például kihasználások megkísérlésére stb.
Lehetséges az Inspect Element letiltása a böngészőben?
A rövid válasz: nem.
Az Inspect Element nem tiltható le a böngészőben, de beállíthat olyan paramétereket, amelyek megakadályozzák, hogy a felhasználók bizonyos műveleteket hajtsanak végre, például a jobb gombbal kattintsanak egy weboldalra. Számos online oktatóanyag található a megfelelő szkriptek beállításához bizonyos események letiltásához. Az Elem vizsgálata funkciót azonban nem lehet teljes egészében letiltani.
Ismerje meg a weboldal belső tulajdonságait
Az Inspect Element funkció megtekintése egy weboldalon valószínűleg egy olyan fejlesztői eszköz, amelyre soha nem tudta, hogy szüksége van rá – még akkor is, ha maga nem fejlesztő. Rengeteg tervezési és marketingalkalmazással rendelkezik, amelyek simábbá tehetik webhelye működését. És talán előnyhöz juttatja a versenytársat.
Mire használod az Inspect Element-et? Mondja el nekünk az alábbi megjegyzések részben.