Hvordan laste opp enkelt bilde ved hjelp av JavaScript og HTML

JavaScript er det kraftigste verktøyet som gir et bredt spekter av funksjoner. Det hjelper med å forbedre bilder for menneskelig evaluering, analyse og tolkning. Mer spesifikt, i nettutvikling, spiller bilder en avgjørende rolle. Informasjon i form av bilder kan hentes ut og behandles fra bilder for datastyrt evaluering. Pikslene i det angitte bildet kan håndteres og kontrolleres til ønsket kontrast og tetthet.

Denne oppskrivningen vil demonstrere metoden for å laste opp bildet ved hjelp av JavaScript og HTML.

Hvordan laste opp et enkelt bilde ved hjelp av JavaScript/HTML?

For å laste opp et enkelt bilde ved hjelp av JavaScript, vil vi først legge til en bildekode på HTML -siden og deretter bruke JavaScript -koden for å laste inn og velge bildet på websiden.

For praktiske implikasjoner, prøv de uttalte instruksjonene.

Eksempel

Først av alt, følg de gitte instruksjonene:

• Sett inn “”Element og spesifiser typen inngang som“fil”.
• Denne "fil" -typen bestemmer feltet i filvalget og en "Bla gjennom”-Knappen for å laste opp filene.
• “
  ”Tag setter inn en linjepause.
• Sett deretter inn en "”HTML -tag og legg til“id”Attributt for å spesifisere den unike IDen med et bestemt navn.
• “src”Attributt som brukes til å legge til nettadressen til mediefilen:

Det kan legges merke til at det er opprettet et filalternativ, og det kan bare vise bildenavnet etter å ha akseptert det en inndata:

Nå, inne i “”Tag, bruk følgende kode:

I ovennevnte kodebit:

• “AddEventListener ()”JavaScript -metoden tillater å sette inn eller feste en definert hendelsesbehandler til et element.
• “QuerySelector ()”Er en metode som brukes til å returnere det første elementet i det aktuelle dokumentet som lenker til den aktuelle velgeren.
• “getElementById ()”Metoden brukes for å få elementet ved å bruke den definerte ID. For det formålet sendes verdien av det som parameter.
• “RevokeObjecturl ()”Slipper en eksisterende objekt -URL som er opprettet ved å bruke URL -en. For å gjøre det, blir URL -en til bildet bestått som parameter for denne metoden.
• “createObjecturl ()”Er en statisk metode for JavaScript som gjør at en bestemt streng har en URL som representerer objektet som er bestått i parameteren.

Produksjon

Det kan legges merke til at vi har lastet opp et enkelt bilde med hell.

Konklusjon

For å laste opp det enkle bildet ved hjelp av JavaScript, bruk "AddEventListener ()”Metode som tillater å sette inn eller feste en definert hendelsesbehandler til et element. Deretter får du tilgang til det definerte elementet med ID og bruk "RevokeObjecturl ()”Og“createObjecturl ()”Metoder. Dette innlegget uttalte den enkle bildelastingsmetoden ved hjelp av JavaScript/HTML.