Kuinka tarkastaa elementti iPhonessa: kaikki mitä sinun tarvitsee tietää

Jos et tiedä, verkkosivu koostuu joukosta elementtejä, jotka on muotoiltu näyttämään yhtenä kokonaisuutena. Verkkokehittäjien on ymmärrettävä jokainen näistä elementeistä, kuinka ne on sijoitettu verkkosivulle, ja nähdä, kuinka kukin niistä toimii yksinään.

Windows- ja Mac-käyttäjät tuntevat "Tarkista" tai "Tarkista elementti" -vaihtoehdon, joka on käytettävissä, kun napsautat hiiren kakkospainikkeella mitä tahansa verkkosivua. Tämä vaihtoehto tarjoaa tavan tarkastella verkkosivuston lähdekoodia, nähdä kaikki sen elementit, niiden takana oleva koodirivi ja muokata sen Javascriptiä, HTML:ää, CSS:ää ja kaikkia muita siinä olevia mediatiedostoja. Näin et vain opi tietyn verkkosivuston toimintaa ja toimintaa, vaan voit tehdä siihen muutoksia omalla selaimellasi ilman, että ne vaikuttavat varsinaiseen verkkosivuun. 

Vaikka tarkastusvaihtoehdon tiedetään olevan "kehittäjän" työkalu, eivät vain kehittäjät hyötyvät siitä. Jopa aloittelijat ja ei-kehittäjät voivat käyttää tätä työkalua oppiakseen, miten verkkosivusto rakennetaan ja kuinka jokainen sen elementti toimii yhdessä. Jos aiot käyttää tarkastuselementtivaihtoehtoa selatessasi Internetiä iPhonella, tämän viestin pitäisi auttaa sinua löytämään tavan tehdä se. 

Aiheeseen liittyvä: Kuinka tarkastaa elementti Androidissa

Voitko tarkastaa verkkoelementtejä suoraan Safarissa?

Yksinkertainen vastaus on ei. iOS:n Safari, kuten monet muut mobiiliselaimet, ei tarjoa sinulle alkuperäistä tarkastustyökalua verkkosivun kehityksen tarkastelemiseen. Apple ei selitä, miksi tällaista vaihtoehtoa ei ole, mutta uskomme, että se liittyy älypuhelimien näyttöjen pienikokoisuuteen. Pienempi näyttökoko voi vaikeuttaa käyttäjien liikkumista tarkastettavien laatikoiden ympärillä, koska sinun on ehkä asetettava kohdistin varovasti, kun haluat muokata verkkosivun koodia tai jopa löytää sellaisen. 

Toinen syy tähän voi olla älypuhelimien laskentatehon puute. Vaikka nykyaikaisissa iPhoneissa on tarpeeksi tehoa grafiikkaintensiivisten pelien pelaamiseen, voi olla hankalaa tarkastella verkkosivuston sivutietoja, koska kaikkia verkkosivustoja ei luoda samalla tavalla. Joillakin verkkosivustoilla voi olla paljon resursseja ja tasoja, jotka on suunniteltu huolellisesti, jotta ne näyttävät saumattomilta, mutta samojen resurssien latautuminen voi kestää jonkin aikaa, kun ne tarkastetaan. 

Aiheeseen liittyvä: Videon toisto iPhonessa [opas]

Tarkista elementti iPhonessa: Mitä muita vaihtoehtoja sinulla on?

Vaikka et voi natiivisti käyttää "Tarkista elementtiä" -työkalua iOS:n Safari-sovelluksessa, on silti tapoja kiertää tämä rajoitus. Alla on kolme tapaa, joilla voit tarkastaa iPhonesi Safarissa vierailemiesi verkkosivujen osia. 

Tapa 01: Safarin käyttäminen Macissa

Jos omistat iPhonesi lisäksi macOS-laitteen, voit silti tarkastella verkkosivuja suoraan Safari-sovelluksesta, mutta Macissa. Apple mahdollistaa verkkosivujen virheenkorjauksen Safarista iOS:ssä samalla tavalla kuin Macissa käyttämällä Kehitystyökaluja. Vaikka sivuston virheenkorjausprosessi on suhteellisen yksinkertainen, sen alkuasetus voi olla pidempi kuin odotat. Mutta älä huoli, selitämme asennusprosessin yksinkertaisimmalla mahdollisella tavalla ja autamme sinua tarkastamaan sivut helposti ensimmäisen kerran. 

Ota Web Inspector käyttöön iOS:ssä

Jotta voit korjata verkkoelementtejä, sinun on ensin otettava Web Inspector käyttöön iOS:n Safari-sovelluksessa. Voit tehdä tämän avaamalla Asetukset-sovelluksen ja valitsemalla 'Safari'.

Kuinka tarkastaa elementti iPhonessa: kaikki mitä sinun tarvitsee tietää

Vieritä Safarissa alaspäin ja napauta "Lisäasetukset". 

Kuinka tarkastaa elementti iPhonessa: kaikki mitä sinun tarvitsee tietää

Napauta seuraavassa näytössä 'Web Inspector' -kohdan vieressä olevaa kytkintä, kunnes se muuttuu vihreäksi. 

Kuinka tarkastaa elementti iPhonessa: kaikki mitä sinun tarvitsee tietää

Alkuasennus Macissa

Kun olet ottanut Web Inspector for Safarin käyttöön iOS:ssä, on aika tehdä asetukset Macissasi. Avaa Macissa Safari-sovellus, napsauta valikkopalkista Safari-vaihtoehtoa ja valitse Asetukset. 

Kuinka tarkastaa elementti iPhonessa: kaikki mitä sinun tarvitsee tietää

Valitse avautuvassa ikkunassa ylhäältä Lisäasetukset-välilehti ja valitse Näytä kehitysvalikko valikkorivillä -ruutu. 

Kuinka tarkastaa elementti iPhonessa: kaikki mitä sinun tarvitsee tietää

Kehitä-vaihtoehdon pitäisi nyt näkyä yläreunan valikkopalkissa. 

Kuinka tarkastaa elementti iPhonessa: kaikki mitä sinun tarvitsee tietää

Muodosta nyt yhteys iPhonen ja Macin välille iPhonen mukana tulleen USB-kaapelin avulla. Kun iPhonesi on yhdistetty Maciin, voit napsauttaa valikkopalkissa Kehitä ja katsoa, ​​näkyykö iPhonesi laiteluettelossa. Jos kyllä, napsauta laitteen nimeä tästä luettelosta. 

Kuinka tarkastaa elementti iPhonessa: kaikki mitä sinun tarvitsee tietää

Varmistaaksesi, että voit tarkastaa verkkosivuja langattomasti ilman USB-kaapelia, kuten teit juuri nyt, napsauta Yhdistä verkon kautta -vaihtoehtoa, kun iPhone-valikko avautuu. 

Kuinka tarkastaa elementti iPhonessa: kaikki mitä sinun tarvitsee tietää

Nyt voit irrottaa iPhonesi Macista ja voit silti tarkastaa verkkosivuja kytkemättä kaapelia niiden väliin. 

Tarkista verkkosivut iOS:stä Macissa

Nyt kun olet ottanut käyttöön "Yhdistä verkon kautta" -vaihtoehdon "Kehitä"-valikosta, voit tarkastella verkkosivuja iOS:n Safarista suoraan Macillasi. Sinun tarvitsee vain varmistaa, että sekä iPhone että Mac ovat yhteydessä samaan langattomaan verkkoon, jotta voit korjata verkkosivuja langattomasti. 

Avaa Safari-sovellus iPhonessasi ja siirry tarkastettavalle verkkosivulle. 

Kun iPhonesi lukitus on avattu ja valittu verkkosivu on auki, siirry Maciin ja avaa Safari-sovellus siellä. Napsauta tässä valikkoriviltä "Kehitä" ja siirry kohtaan "iPhone". 

Kuinka tarkastaa elementti iPhonessa: kaikki mitä sinun tarvitsee tietää

Kun viet hiiren osoittimen iPhonen päälle, sinun pitäisi nähdä luettelo verkkosivuista, jotka ovat avoinna iOS:ssä. Napsauta tästä luettelosta verkkosivua, jota haluat tarkastella. 

Kuinka tarkastaa elementti iPhonessa: kaikki mitä sinun tarvitsee tietää

Mac-tietokoneeseen latautuu uusi ikkuna, joka näyttää kaikki tiedot, jotka voidaan tarkastella valitulta verkkosivulta. 

Kuinka tarkastaa elementti iPhonessa: kaikki mitä sinun tarvitsee tietää

Voit milloin tahansa tarkastuksen aikana nähdä, mihin sivun kohtaan koodirivi osoittaa etsimällä sinistä aluetta iPhonessasi.

Kuinka tarkastaa elementti iPhonessa: kaikki mitä sinun tarvitsee tietää

Tämä sininen alue osoittaa, että koodi, jonka päällä viet hiiren Macissa, muodostaa tämän verkkosivun korostetun elementin. Siirtyminen eri koodirivien välillä siirtää tämän sinisen korostuksen iPhonen sivun eri osiin reaaliajassa. 

Aiheeseen liittyvä: Tehosteiden säilyttäminen FaceTimessa

Tapa 02: Pikanäppäinten käyttäminen iOS:ssä 

Jos et omista Macia tai haluat kurkistaa verkkosivustolle suoraan iPhonesta, sinun on ilo tietää, että iOS Shortcuts -sovellus tähän. iOS:n Pikakuvakkeet-sovellus tarjoaa joukon valmiita valintoja, joiden avulla voit tarkastella sivun lähdekoodia, muokata verkkosivua, napata kuvia verkkosivustolta ja etsiä verkkosivun vanhempia versioita Safari-sovelluksesta. Valitettavasti iOS:ssä ei ole yhtä pikakuvaketta, joka tarjoaisi täysimittaisen verkkovirheenkorjauksen, joten sinun on lisättävä pikakuvake kutakin näistä tarkoituksista. 

Löysimme seuraavat pikakuvakkeet, joiden avulla voit suorittaa virheenkorjauksen verkkosivustoilla suoraan iOS:stä. Nämä ovat:

Näytä lähdekoodi – Tämän pikanäppäimen avulla voit tarkastella verkkosivun lähdekoodia base bones -muodossa. 

Kuinka tarkastaa elementti iPhonessa: kaikki mitä sinun tarvitsee tietää

Muokkaa verkkosivua – Tämän pikanäppäimen avulla voit muokata verkkosivun sisältöä paikallisesti, jotta voit testata uutta ulkoasua tai muotoa ja miltä se voi näyttää iPhonessasi. 

Kuinka tarkastaa elementti iPhonessa: kaikki mitä sinun tarvitsee tietää

Hae kuvat sivulta – Ensisijainen syy sivun tarkastamiseen voi olla kuvien katsominen tai kuvien tallentaminen, jotka muuten eivät ole vuorovaikutteisia. Tämä pikakuvake nappaa kaikki kuvat tietyltä verkkosivulta ja esikatselee niitä sitten yhdessä. Kuten alla oleva kuvakaappaus osoittaa, voit tarkastella jokaista 24 kuvasta, joita isännöi valitulla verkkosivulla. 

Kuinka tarkastaa elementti iPhonessa: kaikki mitä sinun tarvitsee tietää

Wayback Machine – Tämä pikakuvake vie sinut verkkosivun Wayback Machineen, jossa näet sen aiemmat versiot, jotka säilyvät tallennettuna Internet-arkistoon. 

Riippuen siitä, kuinka haluat tarkastella verkkosivuja iOS:ssä, voit lisätä minkä tahansa näistä pikanäppäimistä iPhonellesi joko napsauttamalla yllä olevia linkkejä tai etsimällä niitä kohdasta Pikakuvakkeet > Galleria. 

Kuinka tarkastaa elementti iPhonessa: kaikki mitä sinun tarvitsee tietää

Napauta hakutuloksissa pikakuvaketta, jonka haluat lisätä iPhoneen. 

Kuinka tarkastaa elementti iPhonessa: kaikki mitä sinun tarvitsee tietää

Kun esikatseluruutu avautuu, napauta "Lisää widget" -vaihtoehtoa alareunassa. 

Kuinka tarkastaa elementti iPhonessa: kaikki mitä sinun tarvitsee tietää

Kaikki pikanäppäimet näkyvät Omat pikakuvakkeet > Kaikki pikakuvakkeet -näytössä, ja ne ovat myös käytettävissä Safarin Jaa-välilehdessä.  

Kuinka tarkastaa elementti iPhonessa: kaikki mitä sinun tarvitsee tietää

Voit tarkistaa verkkosivun avaamalla sen Safarissa ja napauttamalla alareunassa olevaa Jaa-painiketta. 

Kuinka tarkastaa elementti iPhonessa: kaikki mitä sinun tarvitsee tietää

Vieritä näkyviin tulevaa Jaa-arkkia alaspäin ja etsi iPhoneen lisäämäsi pikakuvakkeet. 

Kuinka tarkastaa elementti iPhonessa: kaikki mitä sinun tarvitsee tietää

Valitsemalla Muokkaa Web-sivua voit muokata verkkosivun osia suoraan. Kun valitset jonkin kolmesta muusta vaihtoehdosta, sinulta kysytään, haluatko pikakuvakkeen päästävän verkkosivulle. Napauta tässä kohtaa "Salli kerran". 

Kuinka tarkastaa elementti iPhonessa: kaikki mitä sinun tarvitsee tietää

Aiheeseen liittyvä: WidgetSmithin lisääminen aloitusnäyttöön

Tapa 03: Kolmannen osapuolen sovellusten käyttäminen

Jos et ole tyytyväinen yllä oleviin tuloksiin, sinun on tutkittava kolmannen osapuolen sovelluksia voidaksesi tarkastaa verkkosivun osia. Safarin tapaan et löydä tapaa tarkastella verkkosivua suosituimmista selaimista (Chrome, Firefox, Brave jne.). Sen sijaan sinun on luotettava sovellukseen, joka on luotu suorittamaan tämä tietty tehtävä, ja tällaisia ​​sovelluksia voi olla vaikea löytää.

Vaikka yksinkertainen haku App Storesta antaa sinulle useita tuloksia verkkoelementtien tarkastamiseen, et löydä kovin monia sovelluksia, jotka ovat saatavilla ilmaiseksi ja jotka on arvioitu korkealle. Käyttäjien palautteen perusteella suosittelemme, että asennat  App Storesta  Inspect Browser- tai Gear Browser -sovellukset, jotka tarjoavat elementtien tarkastuksen ja muokkaamisen JavaScriptissä, CSS:ssä ja HTML:ssä.

Siinä kaikki, mitä sinun tarvitsee tietää iPhonen osien tarkastamisesta. 

LIITTYVÄT


Leave a Comment

🚀 Korjaa Microsoft Teamsin mikrofonivirhe: Ei ääntä 5 minuutissa – Todistetut ohjeet!

🚀 Korjaa Microsoft Teamsin mikrofonivirhe: Ei ääntä 5 minuutissa – Todistetut ohjeet!

Oletko kyllästynyt Microsoft Teamsin mikrofonivirheeseen, jossa ei ole ääntä? Löydä nopeita ja luotettavia korjauksia Windowsille, Macille ja muille. Vaiheittainen opas äänen palauttamiseen välittömästi ja puheluihin liittymiseen luottavaisin mielin.

🚀 Microsoft Teamsin offline-virhe vuonna 2026? Korjaa se minuuteissa tämän perimmäisen oppaan avulla!

🚀 Microsoft Teamsin offline-virhe vuonna 2026? Korjaa se minuuteissa tämän perimmäisen oppaan avulla!

Onko sinulla ongelmia Microsoft Teamsin offline-virheen kanssa vuonna 2026? Tutustu todistettuihin vianmääritysohjeisiin, joilla voit ratkaista yhteysongelmat nopeasti. Palaa saumattomaan yhteistyöhön nyt!

🚀 Korjaa Microsoft Teamsin virhe D-tiedostot NOPEASTI: Todistetut vianmääritysvaiheet

🚀 Korjaa Microsoft Teamsin virhe D-tiedostot NOPEASTI: Todistetut vianmääritysvaiheet

Jumiutunut Microsoft Teamsin virhe D -tiedostojen kanssa? Saat välitöntä helpotusta vaiheittaisen vianmääritysoppaamme avulla. Korjaa lähetys-, lataus- ja jakamisvirheet Teamsissa vaivattomasti. Päivitetty uusimmilla korjauksilla.

Korjaa Microsoft Teams -virhe 4oggx NOPEASTI: 5 todistettua ratkaisua, jotka toimivat nyt!

Korjaa Microsoft Teams -virhe 4oggx NOPEASTI: 5 todistettua ratkaisua, jotka toimivat nyt!

Onko sinulla ongelmia Microsoft Teamsin virheen 4oggx kanssa? Tutustu nopeisiin, vaiheittaisiin ratkaisuihin yhteysongelmien, välimuistiongelmien ja muiden ongelmien ratkaisemiseksi. Palaa saumattomaan tiimityöhön muutamassa minuutissa asiantuntijaoppaamme avulla.

🚀 Korjaa Microsoft Teamsin tehtävienhallinnan virhe minuuteissa: Todistetut 2026-ratkaisut!

🚀 Korjaa Microsoft Teamsin tehtävienhallinnan virhe minuuteissa: Todistetut 2026-ratkaisut!

Oletko kyllästynyt turhauttavaan Microsoft Teamsin tehtävienhallinnan virheeseen? Hanki välittömiä korjauksia vaiheittaisen oppaamme avulla. Tyhjennä välimuisti, päivitä sovellukset ja palauta saumaton tehtävien synkronointi jo tänään.

Microsoft Teams vs. Slack 2026: Kumpi työkalu voittaa työpaikkakilpailun?

Microsoft Teams vs. Slack 2026: Kumpi työkalu voittaa työpaikkakilpailun?

Sukella Microsoft Teamsin ja Slackin väliseen lopulliseen yhteenottoon vuonna 2026. Vertaile ominaisuuksia, hinnoittelua, tekoälyintegraatioita ja tietoturvaa ja selvitä, mikä yhteistyötyökalu tehostaa tiimisi tuottavuutta. Löydä itsellesi parhaiten sopiva ratkaisu nyt!

🚀 Täydellinen opas vuodelle 2026: Liity Microsoft Teams -kokoukseen vieraana sekunneissa – ei tiliä tarvita!

🚀 Täydellinen opas vuodelle 2026: Liity Microsoft Teams -kokoukseen vieraana sekunneissa – ei tiliä tarvita!

Opi liittymään Microsoft Teams -kokoukseen vieraana vuonna 2026 tämän varman oppaan avulla. Vaiheittaiset ohjeet tietokoneelle, mobiililaitteille, vianmääritykselle ja ammattilaisten vinkeille saumattoman osallistumisen varmistamiseksi joka kerta. Täydellinen ulkoisille yhteistyökumppaneille!

🚀 Välitön korjaus: Poista Microsoft Teams -pelilaajennuksen virhe ikuisesti!

🚀 Välitön korjaus: Poista Microsoft Teams -pelilaajennuksen virhe ikuisesti!

Oletko kyllästynyt turhauttavaan Microsoft Teams -pelilaajennuksen virheeseen, joka estää hauskanpitoasi? Tutustu todistettuihin, vaiheittaisiin ratkaisuihin, jotka ratkaisevat ongelman nopeasti ja saumattomasti. Palaa pelaamisen pariin tiimisi kanssa jo tänään!

🚀 Korjaa Microsoft Teams VCRUNTIME140.dll puuttuva virhe NOPEASTI – 100 % toimivat ratkaisut!

🚀 Korjaa Microsoft Teams VCRUNTIME140.dll puuttuva virhe NOPEASTI – 100 % toimivat ratkaisut!

Jumiutuuko VCRUNTIME140.dll puuttuu -virheeseen Microsoft Teamsissa? Tutustu todistettuihin, vaiheittaisiin korjauksiin, joilla voit ratkaista sen välittömästi. Asenna uudelleen, päivitä jaettavat tiedostot ja paljon muuta saumattoman tiimityön varmistamiseksi. Toimii uusimmissa Windows-käyttöjärjestelmissä!

🚀 Microsoft Teamsin asennuskansion löytäminen vuonna 2026: Nopea opas Windowsille, Macille ja Linuxille

🚀 Microsoft Teamsin asennuskansion löytäminen vuonna 2026: Nopea opas Windowsille, Macille ja Linuxille

Tutustu vaiheittaisiin tapoihin löytää Microsoft Teamsin asennuskansio Windowsissa, Macissa ja Linuxissa. Korjaa ongelmia, varmuuskopioi tietoja ja mukauta vaivattomasti luotettavien menetelmiemme avulla. Päivitetty uusimpaan Teams-versioon!