JavaScript addEventListener() su pavyzdžiais

JavaScript addEventListener() su pavyzdžiais

The addEventListener() metodas EventTarget sąsaja nustato funkciją, kuri bus iškviečiama kiekvieną kartą, kai nurodytas įvykis bus pristatytas į tikslą. Šis metodas leidžia naudoti kelis elemento įvykių tvarkykles, įgalindamas dinamišką ir lankstų sąveikos valdymą žiniatinklio programose.

Sintaksė:

element.addEventListener(event, listener, useCapture); 

Parametrai:

  • įvykis: įvykis gali būti bet koks galiojantis JavaScript įvykis. Įvykiai naudojami be priešdėlių, pavyzdžiui, paspaudimas vietoj onclick arba mousedown vietoj onmousedown.
  • klausytojas (tvarkyklės funkcija): Tai gali būti JavaScript funkcija, kuri reaguoja į įvykį.
  • useCapture: Tai pasirenkamas parametras, naudojamas įvykių plitimui valdyti. Būlio reikšmė perduodama kur tiesa žymi fiksavimo fazę ir klaidinga žymi burbuliavimo fazę.

1 pavyzdys: Šiame pavyzdyje mes pateiksime tekstą tinklalapyje spustelėję mygtuką.

HTML Dokumento pavadinimas> galva> <body> <button id='try'>Spustelėkite čia mygtuką> <h1 id='text'>h1> <script>document.getElementById('try').addEventListener('click', function () { document.getElementById('text').innerText = 'techcodeview.com'; }); script> body> html>>> </tag> <p dir='ltr'> <b> <strong>Išvestis: </strong> </b> <span> </span> </p> <img src='//techcodeview.com/img/javascript-methods/82/javascript-addeventlistener-with-examples.webp' alt='JavaScript addEventListener() su pavyzdžiais'> <p>JavaScript addEventListener() su pavyzdžiais </p> <p dir='ltr'> <br> <b> <strong>2 pavyzdys: </strong> </b> <span>Šiame pavyzdyje prie to paties elemento pridedami du įvykiai, užvedę pelės žymeklį ir nuvedę pelės žymeklį. Jei virš teksto užvedamas pelės žymeklis, įvyksta pelės žymeklio užvedimo įvykis ir iškviečiama funkcija „RespondMouseOver“, panašiai ir užvedus pelės žymeklį, iškviečiama funkcija „RespondMouseOut“. </span> </p>HTML <tag data-text-1=' <html lang='en'> <head> <meta charset='UTF-8'> <meta name='viewport' content='width=device-width, initial-scale=1.0'> <title>Dokumento pavadinimas> galva> <body> <button id='clickIt'>Spustelėkite čia mygtuką> <p id='hoverPara'>Užveskite pelės žymeklį virš šio teksto !p> <b id='effect'>b> <script>const x = document.getElementById('clickIt'); const y = document.getElementById('hoverPara'); x.addEventListener('click', RespondClick); y.addEventListener('mouseover', RespondMouseOver); y.addEventListener('mouseout', RespondMouseOut); function RespondMouseOver() { document.getElementById('effect').innerHTML += 'MouseOver Event' + ' '; } function RespondMouseOut() { document.getElementById('effect').innerHTML += 'MouseOut Event' + ' '; } function RespondClick() { document.getElementById('effect').innerHTML += 'Spustelėjimo įvykis' + ' '; } scenarijus> body> html>>> </tag> <p dir='ltr'> <b> <strong>Išvestis: </strong> </b> <span> </span> </p> <img src='//techcodeview.com/img/javascript-methods/82/javascript-addeventlistener-with-examples-2.webp' alt='JavaScript addEventListener() su pavyzdžiais'> <p>JavaScript addEventListener() su pavyzdžiais </p> <br> <br> </div> <!-- Article Footer with Prominent Share Buttons --> <div class="px-6 md:px-8 py-8 bg-slate-50 dark:bg-slate-900/50 border-t border-slate-200 dark:border-slate-700/50"> <div class="flex flex-col sm:flex-row items-center justify-between gap-6"> <h4 class="text-base font-bold text-slate-700 dark:text-slate-300 uppercase tracking-wide flex items-center gap-2"> <i class="fa fa-share-alt text-tech-500"> </i> Bendrinti </h4> <div class="flex flex-wrap justify-center gap-3"> <!-- Twitter --> <a href="https://twitter.com/intent/tweet?text=JavaScript addEventListener() su pavyzdžiais&url=https://www.techcodeview.com/lt/javascript-addeventlistener-with-examples" target="_blank" rel="noopener noreferrer" class="flex items-center gap-2 px-6 py-3 rounded-xl bg-[#1DA1F2]/10 text-[#1DA1F2] hover:bg-[#1DA1F2] hover:text-white transition-all duration-300 font-bold text-sm"> <i class="fa fa-twitter text-lg"> </i> <span class="hidden sm:inline">Twitter </span> </a> <!-- Facebook --> <a href="https://www.facebook.com/sharer/sharer.php?u=https://www.techcodeview.com/lt/javascript-addeventlistener-with-examples" target="_blank" rel="noopener noreferrer" class="flex items-center gap-2 px-6 py-3 rounded-xl bg-[#4267B2]/10 text-[#4267B2] hover:bg-[#4267B2] hover:text-white transition-all duration-300 font-bold text-sm"> <i class="fa fa-facebook text-lg"> </i> <span class="hidden sm:inline">Facebook </span> </a> <!-- LinkedIn --> <a href="https://www.linkedin.com/shareArticle?mini=true&url=https://www.techcodeview.com/lt/javascript-addeventlistener-with-examples&title=JavaScript addEventListener() su pavyzdžiais" target="_blank" rel="noopener noreferrer" class="flex items-center gap-2 px-6 py-3 rounded-xl bg-[#0077b5]/10 text-[#0077b5] hover:bg-[#0077b5] hover:text-white transition-all duration-300 font-bold text-sm"> <i class="fa fa-linkedin text-lg"> </i> <span class="hidden sm:inline">LinkedIn </span> </a> </div> </div> </div> </article> <!-- Comments Placeholder / Random Articles --> <div class="mt-8 bg-white dark:bg-slate-800 border border-slate-200 dark:border-slate-700 rounded-xl p-6 md:p-8 shadow-sm"> <h3 class="text-xl font-bold text-slate-900 dark:text-white mb-6 uppercase tracking-wide border-b border-slate-200 dark:border-slate-700 pb-2"> Jums Gali Patikti </h3> <div class="grid grid-cols-1 md:grid-cols-2 gap-6"> <div class="group"> <a href="/lt/177-college-essay-examples-131842" class="block aspect-video rounded-lg overflow-hidden bg-slate-200 dark:bg-slate-700 mb-3"> <img loading="lazy" src="https://techcodeview.com/img/blog/72/177-college-essay-examples.webp" onerror="this.onerror=null; this.src='https://techcodeview.com/template/assets/images/unnamed.webp'" alt="177 kolegijos esė pavyzdžiai 11 mokyklų + ekspertų analizė" class="w-full h-full object-cover group-hover:scale-105 transition-transform duration-500"> </a> <h4 class="font-bold text-slate-900 dark:text-white leading-tight group-hover:text-tech-500 transition-colors"> <a href="/lt/177-college-essay-examples-131842">177 kolegijos esė pavyzdžiai 11 mokyklų + ekspertų analizė </a> </h4> </div> <div class="group"> <a href="/lt/complete-list-ncaa-division-1-colleges-131614" class="block aspect-video rounded-lg overflow-hidden bg-slate-200 dark:bg-slate-700 mb-3"> <img loading="lazy" src="https://techcodeview.com/img/blog/72/complete-list-ncaa-division-1-colleges.webp" onerror="this.onerror=null; this.src='https://techcodeview.com/template/assets/images/unnamed.webp'" alt="Visas NCAA 1 skyriaus kolegijų sąrašas (naujausias)" class="w-full h-full object-cover group-hover:scale-105 transition-transform duration-500"> </a> <h4 class="font-bold text-slate-900 dark:text-white leading-tight group-hover:text-tech-500 transition-colors"> <a href="/lt/complete-list-ncaa-division-1-colleges-131614">Visas NCAA 1 skyriaus kolegijų sąrašas (naujausias) </a> </h4> </div> </div> </div> </div> <!-- SECONDARY COLUMN (SIDEBAR) --> <!-- Aside Column --> <div class="lg:col-span-4 space-y-8"> <!-- Best Articles Widget --> <div class="rounded-xl bg-white dark:bg-slate-800 border border-slate-200 dark:border-slate-700 p-6 shadow-sm"> <div class="mb-4 border-b border-slate-100 dark:border-slate-700 pb-2"> <h2 class="text-lg font-bold text-slate-900 dark:text-white uppercase tracking-wide flex items-center"> <span class="mr-2 h-2 w-2 rounded-full bg-tech-500"> </span> Top Straipsniai </h2> </div> <!-- Owl Carousel Preserved Container --> <div id="owl-carousel-3" class="owl-carousel owl-theme center-owl-nav"> <!-- ARTICLE --> <article class="flex items-start gap-4 p-2 hover:bg-slate-50 dark:hover:bg-slate-700/50 rounded-lg transition-colors"> <div class="w-20 h-20 shrink-0 overflow-hidden rounded-md bg-slate-200 dark:bg-slate-700"> <a href="/lt/what-is-an-ap-scholar-1311418"> <img src="https://techcodeview.com/img/blog/03/what-is-an-ap-scholar.webp" onerror="this.onerror=null; this.src='https://techcodeview.com/template/assets/images/unnamed.webp'" alt="Kas yra AP mokslininkas? Privalumai ir reikalavimai" class="w-full h-full object-cover"> </a> </div> <div class="flex-1 min-w-0"> <h4 class="text-sm font-semibold text-slate-800 dark:text-slate-200 leading-snug"> <a href="/lt/what-is-an-ap-scholar-1311418" class="hover:text-tech-500 transition-colors line-clamp-3">Kas yra AP mokslininkas? Privalumai ir reikalavimai </a> </h4> </div> </article> <!-- /ARTICLE --> <!-- ARTICLE --> <article class="flex items-start gap-4 p-2 hover:bg-slate-50 dark:hover:bg-slate-700/50 rounded-lg transition-colors"> <div class="w-20 h-20 shrink-0 overflow-hidden rounded-md bg-slate-200 dark:bg-slate-700"> <a href="/lt/stepping-numbers"> <img src="https://techcodeview.com/img/mathematical/56/stepping-numbers.webp" onerror="this.onerror=null; this.src='https://techcodeview.com/template/assets/images/unnamed.webp'" alt="Žingsniai skaičiai" class="w-full h-full object-cover"> </a> </div> <div class="flex-1 min-w-0"> <h4 class="text-sm font-semibold text-slate-800 dark:text-slate-200 leading-snug"> <a href="/lt/stepping-numbers" class="hover:text-tech-500 transition-colors line-clamp-3">Žingsniai skaičiai </a> </h4> </div> </article> <!-- /ARTICLE --> <!-- ARTICLE --> <article class="flex items-start gap-4 p-2 hover:bg-slate-50 dark:hover:bg-slate-700/50 rounded-lg transition-colors"> <div class="w-20 h-20 shrink-0 overflow-hidden rounded-md bg-slate-200 dark:bg-slate-700"> <a href="/lt/what-is-priority-queue-introduction-priority-queue"> <img src="https://techcodeview.com/img/priority-queue/56/what-is-priority-queue-introduction-priority-queue.webp" onerror="this.onerror=null; this.src='https://techcodeview.com/template/assets/images/unnamed.webp'" alt="Kas yra prioritetinė eilė | Prioritetinės eilės įvadas" class="w-full h-full object-cover"> </a> </div> <div class="flex-1 min-w-0"> <h4 class="text-sm font-semibold text-slate-800 dark:text-slate-200 leading-snug"> <a href="/lt/what-is-priority-queue-introduction-priority-queue" class="hover:text-tech-500 transition-colors line-clamp-3">Kas yra prioritetinė eilė | Prioritetinės eilės įvadas </a> </h4> </div> </article> <!-- /ARTICLE --> <!-- ARTICLE --> <article class="flex items-start gap-4 p-2 hover:bg-slate-50 dark:hover:bg-slate-700/50 rounded-lg transition-colors"> <div class="w-20 h-20 shrink-0 overflow-hidden rounded-md bg-slate-200 dark:bg-slate-700"> <a href="/lt/explained-what-is-snap-map-242116"> <img src="https://techcodeview.com/img/get-informed/69/explained-what-is-snap-map.webp" onerror="this.onerror=null; this.src='https://techcodeview.com/template/assets/images/unnamed.webp'" alt="Paaiškinta: kas yra „Snap Map“?" class="w-full h-full object-cover"> </a> </div> <div class="flex-1 min-w-0"> <h4 class="text-sm font-semibold text-slate-800 dark:text-slate-200 leading-snug"> <a href="/lt/explained-what-is-snap-map-242116" class="hover:text-tech-500 transition-colors line-clamp-3">Paaiškinta: kas yra „Snap Map“? </a> </h4> </div> </article> <!-- /ARTICLE --> <!-- ARTICLE --> <article class="flex items-start gap-4 p-2 hover:bg-slate-50 dark:hover:bg-slate-700/50 rounded-lg transition-colors"> <div class="w-20 h-20 shrink-0 overflow-hidden rounded-md bg-slate-200 dark:bg-slate-700"> <a href="/lt/tcp-vs-udp"> <img src="https://techcodeview.com/img/computer-network/33/tcp-vs-udp.webp" onerror="this.onerror=null; this.src='https://techcodeview.com/template/assets/images/unnamed.webp'" alt="TCP prieš UDP" class="w-full h-full object-cover"> </a> </div> <div class="flex-1 min-w-0"> <h4 class="text-sm font-semibold text-slate-800 dark:text-slate-200 leading-snug"> <a href="/lt/tcp-vs-udp" class="hover:text-tech-500 transition-colors line-clamp-3">TCP prieš UDP </a> </h4> </div> </article> <!-- /ARTICLE --> <!-- ARTICLE --> <article class="flex items-start gap-4 p-2 hover:bg-slate-50 dark:hover:bg-slate-700/50 rounded-lg transition-colors"> <div class="w-20 h-20 shrink-0 overflow-hidden rounded-md bg-slate-200 dark:bg-slate-700"> <a href="/lt/booting-operating-system"> <img src="https://techcodeview.com/img/operating-system/96/booting-operating-system.webp" onerror="this.onerror=null; this.src='https://techcodeview.com/template/assets/images/unnamed.webp'" alt="Paleidimas operacinėje sistemoje" class="w-full h-full object-cover"> </a> </div> <div class="flex-1 min-w-0"> <h4 class="text-sm font-semibold text-slate-800 dark:text-slate-200 leading-snug"> <a href="/lt/booting-operating-system" class="hover:text-tech-500 transition-colors line-clamp-3">Paleidimas operacinėje sistemoje </a> </h4> </div> </article> <!-- /ARTICLE --> <!-- ARTICLE --> <article class="flex items-start gap-4 p-2 hover:bg-slate-50 dark:hover:bg-slate-700/50 rounded-lg transition-colors"> <div class="w-20 h-20 shrink-0 overflow-hidden rounded-md bg-slate-200 dark:bg-slate-700"> <a href="/lt/123movie-alternatives"> <img src="https://techcodeview.com/img/alternatives/98/123movie-alternatives.webp" onerror="this.onerror=null; this.src='https://techcodeview.com/template/assets/images/unnamed.webp'" alt="123Kino alternatyvos" class="w-full h-full object-cover"> </a> </div> <div class="flex-1 min-w-0"> <h4 class="text-sm font-semibold text-slate-800 dark:text-slate-200 leading-snug"> <a href="/lt/123movie-alternatives" class="hover:text-tech-500 transition-colors line-clamp-3">123Kino alternatyvos </a> </h4> </div> </article> <!-- /ARTICLE --> <!-- ARTICLE --> <article class="flex items-start gap-4 p-2 hover:bg-slate-50 dark:hover:bg-slate-700/50 rounded-lg transition-colors"> <div class="w-20 h-20 shrink-0 overflow-hidden rounded-md bg-slate-200 dark:bg-slate-700"> <a href="/lt/14-last-minute-act-tips-you-should-use-131974"> <img src="https://techcodeview.com/img/blog/51/14-last-minute-act-tips-you-should-use.webp" onerror="this.onerror=null; this.src='https://techcodeview.com/template/assets/images/unnamed.webp'" alt="14 paskutinės minutės ACT patarimų, kuriuos turėtumėte naudoti" class="w-full h-full object-cover"> </a> </div> <div class="flex-1 min-w-0"> <h4 class="text-sm font-semibold text-slate-800 dark:text-slate-200 leading-snug"> <a href="/lt/14-last-minute-act-tips-you-should-use-131974" class="hover:text-tech-500 transition-colors line-clamp-3">14 paskutinės minutės ACT patarimų, kuriuos turėtumėte naudoti </a> </h4> </div> </article> <!-- /ARTICLE --> <!-- ARTICLE --> <article class="flex items-start gap-4 p-2 hover:bg-slate-50 dark:hover:bg-slate-700/50 rounded-lg transition-colors"> <div class="w-20 h-20 shrink-0 overflow-hidden rounded-md bg-slate-200 dark:bg-slate-700"> <a href="/lt/program-to-add-two-fractions"> <img src="https://techcodeview.com/img/mathematical/48/program-to-add-two-fractions.webp" onerror="this.onerror=null; this.src='https://techcodeview.com/template/assets/images/unnamed.webp'" alt="" class="w-full h-full object-cover"> </a> </div> <div class="flex-1 min-w-0"> <h4 class="text-sm font-semibold text-slate-800 dark:text-slate-200 leading-snug"> <a href="/lt/program-to-add-two-fractions" class="hover:text-tech-500 transition-colors line-clamp-3"> </a> </h4> </div> </article> <!-- /ARTICLE --> <!-- ARTICLE --> <article class="flex items-start gap-4 p-2 hover:bg-slate-50 dark:hover:bg-slate-700/50 rounded-lg transition-colors"> <div class="w-20 h-20 shrink-0 overflow-hidden rounded-md bg-slate-200 dark:bg-slate-700"> <a href="/lt/how-prepare-psat-131464"> <img src="https://techcodeview.com/img/blog/64/how-prepare-psat.webp" onerror="this.onerror=null; this.src='https://techcodeview.com/template/assets/images/unnamed.webp'" alt="Kaip pasiruošti PSAT: 5 žingsnių PSAT paruošimo vadovas" class="w-full h-full object-cover"> </a> </div> <div class="flex-1 min-w-0"> <h4 class="text-sm font-semibold text-slate-800 dark:text-slate-200 leading-snug"> <a href="/lt/how-prepare-psat-131464" class="hover:text-tech-500 transition-colors line-clamp-3">Kaip pasiruošti PSAT: 5 žingsnių PSAT paruošimo vadovas </a> </h4> </div> </article> <!-- /ARTICLE --> </div> <!-- Categories --> <div class="mt-8 mb-4 border-b border-slate-100 dark:border-slate-700 pb-2"> <h2 class="text-lg font-bold text-slate-900 dark:text-white uppercase tracking-wide">Kategorija </h2> </div> <div class="flex flex-wrap gap-2"> <a href="/lt/blog/" class="inline-block px-3 py-1 bg-slate-100 dark:bg-slate-700 text-xs font-medium text-slate-600 dark:text-slate-300 rounded-full hover:bg-tech-500 hover:text-white transition-colors"> Dienoraštis </a> <a href="/lt/java-conversion/" class="inline-block px-3 py-1 bg-slate-100 dark:bg-slate-700 text-xs font-medium text-slate-600 dark:text-slate-300 rounded-full hover:bg-tech-500 hover:text-white transition-colors"> Java Konvertavimas </a> <a href="/lt/maths/" class="inline-block px-3 py-1 bg-slate-100 dark:bg-slate-700 text-xs font-medium text-slate-600 dark:text-slate-300 rounded-full hover:bg-tech-500 hover:text-white transition-colors"> Matematika </a> <a href="/lt/java-collections/" class="inline-block px-3 py-1 bg-slate-100 dark:bg-slate-700 text-xs font-medium text-slate-600 dark:text-slate-300 rounded-full hover:bg-tech-500 hover:text-white transition-colors"> Java Kolekcijos </a> <a href="/lt/differences/" class="inline-block px-3 py-1 bg-slate-100 dark:bg-slate-700 text-xs font-medium text-slate-600 dark:text-slate-300 rounded-full hover:bg-tech-500 hover:text-white transition-colors"> Skirtumai </a> <a href="/lt/java-string/" class="inline-block px-3 py-1 bg-slate-100 dark:bg-slate-700 text-xs font-medium text-slate-600 dark:text-slate-300 rounded-full hover:bg-tech-500 hover:text-white transition-colors"> Java Eilutė </a> </div> <!-- Interesting Articles Widget --> <div class="mt-8"> <div class="mb-4 border-b border-slate-100 dark:border-slate-700 pb-2"> <h2 class="text-lg font-bold text-slate-900 dark:text-white uppercase tracking-wide">Įdomios Straipsniai </h2> </div> <div id="owl-carousel-4" class="owl-carousel owl-theme"> <!-- ARTICLE --> <article class="relative aspect-video rounded-lg overflow-hidden group mb-2"> <div class="absolute inset-0"> <img src="https://techcodeview.com/img/c-tutorial/82/binary-decimal-number-c.webp" onerror="this.onerror=null; this.src='https://techcodeview.com/template/assets/images/unnamed.webp'" alt="Dvejetainis skaičius C" class="w-full h-full object-cover group-hover:scale-105 transition-transform duration-500"> <div class="absolute inset-0 bg-gradient-to-t from-black/80 to-transparent"> </div> </div> <div class="absolute bottom-0 left-0 p-4"> <div class="text-xs text-tech-400 font-bold mb-1"> <a href="/lt/c-tutorial/">C Pamoka </a> </div> <h4 class="text-sm font-bold text-white leading-tight"> <a href="/lt/binary-decimal-number-c">Dvejetainis skaičius C </a> </h4> </div> </article> <!-- /ARTICLE --> <!-- ARTICLE --> <article class="relative aspect-video rounded-lg overflow-hidden group mb-2"> <div class="absolute inset-0"> <img src="https://techcodeview.com/img/current-gk/71/top-10-countries-with-highest-suicide-rate-world.webp" onerror="this.onerror=null; this.src='https://techcodeview.com/template/assets/images/unnamed.webp'" alt="10 šalių, kuriose savižudybių rodiklis yra didžiausias pasaulyje" class="w-full h-full object-cover group-hover:scale-105 transition-transform duration-500"> <div class="absolute inset-0 bg-gradient-to-t from-black/80 to-transparent"> </div> </div> <div class="absolute bottom-0 left-0 p-4"> <div class="text-xs text-tech-400 font-bold mb-1"> <a href="/lt/current-gk/">Dabartinis Gk </a> </div> <h4 class="text-sm font-bold text-white leading-tight"> <a href="/lt/top-10-countries-with-highest-suicide-rate-world">10 šalių, kuriose savižudybių rodiklis yra didžiausias pasaulyje </a> </h4> </div> </article> <!-- /ARTICLE --> <!-- ARTICLE --> <article class="relative aspect-video rounded-lg overflow-hidden group mb-2"> <div class="absolute inset-0"> <img src="https://techcodeview.com/img/how/24/how-check-who-viewed-instagram-highlights.webp" onerror="this.onerror=null; this.src='https://techcodeview.com/template/assets/images/unnamed.webp'" alt="Kaip patikrinti, kas peržiūrėjo „Instagram“ svarbiausius dalykus [2024 m.]" class="w-full h-full object-cover group-hover:scale-105 transition-transform duration-500"> <div class="absolute inset-0 bg-gradient-to-t from-black/80 to-transparent"> </div> </div> <div class="absolute bottom-0 left-0 p-4"> <div class="text-xs text-tech-400 font-bold mb-1"> <a href="/lt/how/">Kaip </a> </div> <h4 class="text-sm font-bold text-white leading-tight"> <a href="/lt/how-check-who-viewed-instagram-highlights">Kaip patikrinti, kas peržiūrėjo „Instagram“ svarbiausius dalykus [2024 m.] </a> </h4> </div> </article> <!-- /ARTICLE --> <!-- ARTICLE --> <article class="relative aspect-video rounded-lg overflow-hidden group mb-2"> <div class="absolute inset-0"> <img src="https://techcodeview.com/img/blog/93/best-ap-psychology-notes-study-with.webp" onerror="this.onerror=null; this.src='https://techcodeview.com/template/assets/images/unnamed.webp'" alt="Geriausios AP psichologijos pastabos, su kuriomis galima mokytis" class="w-full h-full object-cover group-hover:scale-105 transition-transform duration-500"> <div class="absolute inset-0 bg-gradient-to-t from-black/80 to-transparent"> </div> </div> <div class="absolute bottom-0 left-0 p-4"> <div class="text-xs text-tech-400 font-bold mb-1"> <a href="/lt/blog/">Dienoraštis </a> </div> <h4 class="text-sm font-bold text-white leading-tight"> <a href="/lt/best-ap-psychology-notes-study-with-1311128">Geriausios AP psichologijos pastabos, su kuriomis galima mokytis </a> </h4> </div> </article> <!-- /ARTICLE --> <!-- ARTICLE --> <article class="relative aspect-video rounded-lg overflow-hidden group mb-2"> <div class="absolute inset-0"> <img src="https://techcodeview.com/img/blog/48/what-are-claremont-colleges.webp" onerror="this.onerror=null; this.src='https://techcodeview.com/template/assets/images/unnamed.webp'" alt="Kas yra Claremont koledžai? Claremont konsorciumo vadovas" class="w-full h-full object-cover group-hover:scale-105 transition-transform duration-500"> <div class="absolute inset-0 bg-gradient-to-t from-black/80 to-transparent"> </div> </div> <div class="absolute bottom-0 left-0 p-4"> <div class="text-xs text-tech-400 font-bold mb-1"> <a href="/lt/blog/">Dienoraštis </a> </div> <h4 class="text-sm font-bold text-white leading-tight"> <a href="/lt/what-are-claremont-colleges-1311446">Kas yra Claremont koledžai? Claremont konsorciumo vadovas </a> </h4> </div> </article> <!-- /ARTICLE --> <!-- ARTICLE --> <article class="relative aspect-video rounded-lg overflow-hidden group mb-2"> <div class="absolute inset-0"> <img src="https://techcodeview.com/img/tally-tutorial/74/how-download-tally-erp-9-software.webp" onerror="this.onerror=null; this.src='https://techcodeview.com/template/assets/images/unnamed.webp'" alt="Kaip atsisiųsti programinę įrangą Tally ERP 9" class="w-full h-full object-cover group-hover:scale-105 transition-transform duration-500"> <div class="absolute inset-0 bg-gradient-to-t from-black/80 to-transparent"> </div> </div> <div class="absolute bottom-0 left-0 p-4"> <div class="text-xs text-tech-400 font-bold mb-1"> <a href="/lt/tally-tutorial/">Tally Pamoka </a> </div> <h4 class="text-sm font-bold text-white leading-tight"> <a href="/lt/how-download-tally-erp-9-software">Kaip atsisiųsti programinę įrangą Tally ERP 9 </a> </h4> </div> </article> <!-- /ARTICLE --> </div> </div> </div> </div> <!-- /Aside Column --> </div> </div> </div> <footer class="site-footer"> <div class="container"> <span class="footer-links"> Copyright ©2026 Visos Teisės Saugomos | <a href="//www.techcodeview.com/lv/">techcodeview.com </a> | <a href="/disclaimer" rel="nofollow noopener noreferrer" target="_blank">Atsisakymas </a> | <a href="/about-us" rel="nofollow noopener noreferrer" target="_blank">Apie Mus </a> | <a href="/privacy-policy" rel="nofollow noopener noreferrer" target="_blank">Privatumo Politika </a> </span> </div> </footer> <script type="text/javascript" src="https://techcodeview.com/template/assets/plugins/jquery-1.11.3.min.js"> </script> <script type="text/javascript" src="https://techcodeview.com/template/assets/plugins/bootstrap/js/bootstrap.min.js"> </script> <script type="text/javascript" src="https://techcodeview.com/template/assets/js/main.js"> </script> <script src="//cdnjs.cloudflare.com/ajax/libs/highlight.js/11.5.1/highlight.min.js"> </script> <script> !function(){"use strict";let t=document.createElement("button");t.id="toTopBtn",t.innerHTML="↑";let e=` #toTopBtn { position: fixed; bottom: 25px; right: 25px; z-index: 9999; opacity: 0; visibility: hidden; background-color: #0ea5e9; color: white; border: none; border-radius: 8px; width: 50px; height: 50px; font-size: 24px; cursor: pointer; transition: opacity 0.3s ease-in-out, visibility 0.3s ease-in-out; } #toTopBtn:hover { background-color: #0284c7; } `,i=document.createElement("style");i.type="text/css",i.innerText=e,document.head.appendChild(i),document.body.appendChild(t),window.addEventListener("scroll",()=>{let e=window.scrollY||document.documentElement.scrollTop;e>300?(t.style.opacity="1",t.style.visibility="visible"):(t.style.opacity="0",t.style.visibility="hidden")}),t.addEventListener("click",()=>{window.scrollTo({top:0,behavior:"smooth"})})}(); </script> </body> </html>