Lasiet JSON failu, izmantojot JavaScript
JSON apzīmē JavaScript objektu apzīmējums . Tas ir veids, kā kārtot datus skripta failā, izmantojot tekstu, atvieglojot datu glabāšanu un kopīgošanu.
Lasīšana JSON faili neatkarīgi no tā, vai tie tiek glabāti lokāli vai serverī, ir ļoti svarīgi tīmekļa lietojumprogrammām. Šajā apmācībā mēs apskatīsim trīs metodes JSON failu lasīšanai JavaScript, kas var būt ļoti noderīga tīmekļa izstrādātājiem.
Satura rādītājs
- Kā lasīt JSON failu JavaScript?
- Izmantojot fetch() API, lai lasītu JSON failu
- Nepieciešamā moduļa izmantošana JSON faila lasīšanai
- Importējot moduli, lai lasītu JSON failu
- Secinājums
PIEZĪME: JavaScript iekšēji atbalsta JSON, tāpēc tam nav nepieciešami papildu moduļi, lai importētu un parādītu JSON. Mums vienkārši ir jāimportē JSON fails, un mēs to varam viegli izmantot, lai ar to veiktu manipulācijas.
Kā lasīt JSON failu JavaScript?
Trīs metodes JSON failu lasīšanai JavaScript ir:
Piezīme: Datu izgūšanai tiks izmantots tālāk norādītais JSON fails.
sample.json
{ 'users':[ { 'site':'techcodeview.com', 'user': 'Shobhit' } ] } 1. Izmantojiet fetch() API, lai lasītu JSON failu
Metode fetch() tiek izmantota JSON failu (vietējo vai augšupielādēto failu) lasīšanai. Abiem failu tipiem tiek izmantota viena un tā pati sintakse.
Sintakse
fetch('JSONFilePath').then().then().catch(); Veiciet šīs darbības, lai lasītu JSON failu, izmantojot API metodi:
- Izveidojiet JSON failu un pievienojiet tam datus
- Atveriet JavaScript failu
- Ieneses metodē nododiet JSON faila ceļu
- Izmantojiet .json() metodi, lai parsētu datus JSON formātā.
- Parādiet saturu konsolē.
Piemērs JSON faila lasīšanai JavaScript:
Tālāk norādītais kods palīdzēs izprast metodes fetch() izmantošanu JSON failu lasīšanai.
HTML Izlasiet JSON faila nosaukumu> head> <body> <h1>techcodeview.comh1> <h3>Dodieties uz konsoli, lai redzētu ienestos datus!! h3> <script>function fetchJSONData() { fetch('./sample.json') .then((res) => { if (!res.ok) { throw new Error (`HTTP kļūda! Statuss: ${res.status} `); } return res.json( }) .then((data) => console.log(data)) .catch((error) => console.error('Nevar ielādēt datus:', kļūda)); } fetchJSONData(); skripts> body> html>>> </tag> <p dir='ltr'> <b> <strong>Izvade: </strong> </b> </p> <p dir='ltr'> <img src='//techcodeview.com/img/javascript-questions/49/read-json-file-using-javascript.webp' alt='JSON datu konsoles skats pēc API ielādes'> </p> <h2 id='using-the-require-module-to-read-json-file'> <b> <strong>2. Require Module izmantošana JSON faila lasīšanai </strong> </b> </h2> <p dir='ltr'> <span>Nepieciešams modulis </span> <span>tiek izmantots, lai jūsu lietojumprogrammā iekļautu moduļus. To var izmantot, lai iekļautu failu tīmekļa lietojumprogrammā. </span> </p> <h3> <span>Sintakse: </span> </h3> <pre>require(JSONFilePath); </pre> </code> <p dir='ltr'> <span>Veiciet šīs darbības, lai lasītu JSON failus, izmantojot nepieciešamo JavaScript moduli. </span> </p> <ul> <li value='1'> <span>Izveidojiet JSON failu, kā norādīts iepriekšējā pieejā </span> </li> <li value='2'> <span>Izveidojiet script.js un izmantojiet vajadzīgo mezgla metodi, lai importētu JSON failu </span> </li> <li value='3'> <span>Izdrukājiet datus konsolē </span> </li> </ul> <p dir='ltr'> <b> <strong>PIEZĪME: </strong> </b> <span>Tā vietā, lai palaistu programmu pārlūkprogrammā, mēs to palaidīsim konsolē, izmantojot Node. Pārliecinieties, vai jums ir vismaz Node versija 17.0. </span> </p> <h3> <b> <strong>Piemērs </strong> </b> </h3> <p dir='ltr'> <span>Tālāk norādīto kodu var tieši ielīmēt skripta failā (jābūt instalētam mezglam), lai izpildītu un izgūtu JSON datus. </span> </p>Javascript <code> <pre>const sample = require('./sample.json'); console.log(sample); </pre> </code> <p dir='ltr'> <b> <strong>Izvade: </strong> </b> </p> <tag data-text-3='{ users: [ { site: 'GeeksForGeeks', user: 'Shobhit' } ] } </pre> <h2 id='by-importing-the-module-to-read-json-file'> <b> <strong>3. Importējot moduli JSON faila lasīšanai </strong> </b> </h2> <p dir='ltr'> <span>The </span> <span>importa paziņojums </span> <span>var izmantot, lai importētu un saglabātu JSON faila elementus JavaScript mainīgajā. </span> </p> <h3> <span>Sintakse: </span> </h3> <pre>import nameOfVariable from 'JSONFilePath' assert {type: 'json'}; </pre> <ul> <li value='1'> <span>Izveidojiet JSON failu, kā aprakstīts iepriekšējos piemēros. </span> </li> <li value='2'> <span>Izveidojiet failu script.js un importējiet JSON failu </span> </li> </ul> <h3> <b> <strong>Piemērs JSON faila lasīšanai JavaScript: </strong> </b> </h3> <p dir='ltr'> <span>Tālāk norādītais kods Nolasa JSON failu, importējot to, izmantojot importēšanas paziņojumu. </span> </p>HTML <code> <pre> <html lang='en'> <head> <meta charset='UTF-8'> <meta name='viewport' content= 'width=device-width, initial-scale=1.0'> <title>Izlasiet JSON faila nosaukumu> head> <body> <h1>techcodeview.comh1> <h3>Dodieties uz konsoli, lai redzētu ienestos datus!! h3> <script type='module' src='./script.js'>skripts> body> html>>> </tag>Javascript <tag data-text-1='// script.js import user from './sample.json' assert { type: 'json' }; console.log(user) </pre> </code> <p dir='ltr'> <b> <strong>Izvade: </strong> </b> </p> <p dir='ltr'> <img src='//techcodeview.com/img/javascript-questions/49/read-json-file-using-javascript.webp' alt='JSON datu konsoles skats, izmantojot importēšanas moduli'> </p> <h2 id='conclusion'> <span>Secinājums </span> </h2> <p dir='ltr'> <span>JSON failu lasīšana JavaScript ir ļoti svarīgs tīmekļa izstrādātāja uzdevums, jo JSON faili tiek izmantoti lietotāja datu, konfigurācijas datu, statisko datu un citas svarīgas informācijas glabāšanai. </span> </p> <p dir='ltr'> <span>Šajā rokasgrāmatā ar piemēriem ir izskaidrotas trīs metodes JSON failu lasīšanai JavaScript. Izprotot šīs metodes, izstrādātāji var droši risināt ar JSON failiem saistītus uzdevumus, nodrošinot vienmērīgākus izstrādes procesus un uzlabotu lietotāju pieredzi. </span> </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>
Kopīgot </h4>
<div class="flex flex-wrap justify-center gap-3">
<!-- Twitter -->
<a href="https://twitter.com/intent/tweet?text=Lasiet JSON failu, izmantojot JavaScript&url=https://www.techcodeview.com/lv/read-json-file-using-javascript"
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/lv/read-json-file-using-javascript"
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/lv/read-json-file-using-javascript&title=Lasiet JSON failu, izmantojot JavaScript"
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 Varētu Patikt </h3>
<div class="grid grid-cols-1 md:grid-cols-2 gap-6">
<div class="group">
<a href="/lv/how-center-images-css" 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/css-tutorial/36/how-center-images-css.webp" onerror="this.onerror=null; this.src='https://techcodeview.com/template/assets/images/unnamed.webp'" alt="Kā centrēt attēlus CSS?" 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="/lv/how-center-images-css">Kā centrēt attēlus CSS? </a>
</h4>
</div> <div class="group">
<a href="/lv/user-acceptance-testing-software-testing" 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/technical-scripter-2022/66/user-acceptance-testing-software-testing.webp" onerror="this.onerror=null; this.src='https://techcodeview.com/template/assets/images/unnamed.webp'" alt="Lietotāja pieņemšanas pārbaude (UAT) — programmatūras testēšana" 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="/lv/user-acceptance-testing-software-testing">Lietotāja pieņemšanas pārbaude (UAT) — programmatūras testēšana </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 Raksti </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="/lv/advantages-disadvantages-bluetooth">
<img src="https://techcodeview.com/img/blog/15/advantages-disadvantages-bluetooth.webp" onerror="this.onerror=null; this.src='https://techcodeview.com/template/assets/images/unnamed.webp'" alt="Bluetooth priekšrocības un trūkumi" 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="/lv/advantages-disadvantages-bluetooth" class="hover:text-tech-500 transition-colors line-clamp-3">Bluetooth priekšrocības un trūkumi </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="/lv/genetic-algorithm-machine-learning">
<img src="https://techcodeview.com/img/machine-learning/42/genetic-algorithm-machine-learning.webp" onerror="this.onerror=null; this.src='https://techcodeview.com/template/assets/images/unnamed.webp'" alt="Ģenētiskais algoritms mašīnmācībā" 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="/lv/genetic-algorithm-machine-learning" class="hover:text-tech-500 transition-colors line-clamp-3">Ģenētiskais algoritms mašīnmācībā </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="/lv/factory-method-design-pattern-java">
<img src="https://techcodeview.com/img/it-problems-solutions/76/factory-method-design-pattern-java.webp" onerror="this.onerror=null; this.src='https://techcodeview.com/template/assets/images/unnamed.webp'" alt="Rūpnīcas metodes dizaina modelis Java" 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="/lv/factory-method-design-pattern-java" class="hover:text-tech-500 transition-colors line-clamp-3">Rūpnīcas metodes dizaina modelis Java </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="/lv/what-is-apple-touch-icon">
<img src="https://techcodeview.com/img/computer/98/what-is-apple-touch-icon.webp" onerror="this.onerror=null; this.src='https://techcodeview.com/template/assets/images/unnamed.webp'" alt="Kas ir Apple Touch ikona?" 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="/lv/what-is-apple-touch-icon" class="hover:text-tech-500 transition-colors line-clamp-3">Kas ir Apple Touch ikona? </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="/lv/what-was-open-door-policy-china-131978">
<img src="https://techcodeview.com/img/blog/22/what-was-open-door-policy-china.webp" onerror="this.onerror=null; this.src='https://techcodeview.com/template/assets/images/unnamed.webp'" alt="Kāda bija atvērto durvju politika Ķīnā?" 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="/lv/what-was-open-door-policy-china-131978" class="hover:text-tech-500 transition-colors line-clamp-3">Kāda bija atvērto durvju politika Ķīnā? </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="/lv/cut-command-linux-with-examples">
<img src="https://techcodeview.com/img/linux-command/34/cut-command-linux-with-examples.webp" onerror="this.onerror=null; this.src='https://techcodeview.com/template/assets/images/unnamed.webp'" alt="izgriezt komandu Linux ar piemēriem" 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="/lv/cut-command-linux-with-examples" class="hover:text-tech-500 transition-colors line-clamp-3">izgriezt komandu Linux ar piemēriem </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="/lv/tail-command-linux-with-examples">
<img src="https://techcodeview.com/img/linux-command/95/tail-command-linux-with-examples.webp" onerror="this.onerror=null; this.src='https://techcodeview.com/template/assets/images/unnamed.webp'" alt="Tail komanda Linux ar piemēriem" 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="/lv/tail-command-linux-with-examples" class="hover:text-tech-500 transition-colors line-clamp-3">Tail komanda Linux ar piemēriem </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="/lv/how-much-does-computer-cost">
<img src="https://techcodeview.com/img/computer/57/how-much-does-computer-cost.webp" onerror="this.onerror=null; this.src='https://techcodeview.com/template/assets/images/unnamed.webp'" alt="Cik maksā dators" 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="/lv/how-much-does-computer-cost" class="hover:text-tech-500 transition-colors line-clamp-3">Cik maksā dators </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="/lv/best-ap-chemistry-notes-study-with-1311558">
<img src="https://techcodeview.com/img/blog/59/best-ap-chemistry-notes-study-with.webp" onerror="this.onerror=null; this.src='https://techcodeview.com/template/assets/images/unnamed.webp'" alt="Labākās AP ķīmijas piezīmes, ar kurām mācīties" 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="/lv/best-ap-chemistry-notes-study-with-1311558" class="hover:text-tech-500 transition-colors line-clamp-3">Labākās AP ķīmijas piezīmes, ar kurām mācīties </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="/lv/what-is-good-sat-score-131766">
<img src="https://techcodeview.com/img/blog/77/what-is-good-sat-score.webp" onerror="this.onerror=null; this.src='https://techcodeview.com/template/assets/images/unnamed.webp'" alt="Kāds ir labs SAT rādītājs 2024. gadam?" 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="/lv/what-is-good-sat-score-131766" class="hover:text-tech-500 transition-colors line-clamp-3">Kāds ir labs SAT rādītājs 2024. gadam? </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="/lv/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">
Emuārs
</a> <a href="/lv/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 Konvertēšana
</a> <a href="/lv/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">
Matemātika
</a> <a href="/lv/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 Kolekcijas
</a> <a href="/lv/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">
Atšķirības
</a> <a href="/lv/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 Virkne
</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">Interesanti Raksti </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/shell-scripting/17/shell-scripting-loop.webp" onerror="this.onerror=null; this.src='https://techcodeview.com/template/assets/images/unnamed.webp'" alt="Shell skriptēšana cilpai" 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="/lv/shell-scripting/">Shell Skriptēšana </a> </div>
<h4 class="text-sm font-bold text-white leading-tight"> <a href="/lv/shell-scripting-loop">Shell skriptēšana cilpai </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/77/how-disable-an-ask.webp" onerror="this.onerror=null; this.src='https://techcodeview.com/template/assets/images/unnamed.webp'" alt="Kā: atspējot Ask.FM kontu" 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="/lv/how/">Kā </a> </div>
<h4 class="text-sm font-bold text-white leading-tight"> <a href="/lv/how-disable-an-ask-242132">Kā: atspējot Ask.FM kontu </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/linux-command/21/how-chmod-777-all-subfolders-var-www.webp" onerror="this.onerror=null; this.src='https://techcodeview.com/template/assets/images/unnamed.webp'" alt="Kā Chmod 777 visas /var/www apakšmapes" 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="/lv/linux-command/">Linux-Komanda </a> </div>
<h4 class="text-sm font-bold text-white leading-tight"> <a href="/lv/how-chmod-777-all-subfolders-var-www">Kā Chmod 777 visas /var/www apakšmapes </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/14/what-is-dbq-document-based-question-explained.webp" onerror="this.onerror=null; this.src='https://techcodeview.com/template/assets/images/unnamed.webp'" alt="Kas ir DBQ? Paskaidrots uz dokumentiem balstīts jautājums" 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="/lv/blog/">Emuārs </a> </div>
<h4 class="text-sm font-bold text-white leading-tight"> <a href="/lv/what-is-dbq-document-based-question-explained-131146">Kas ir DBQ? Paskaidrots uz dokumentiem balstīts jautājums </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/27/11-allusion-examples-literature.webp" onerror="this.onerror=null; this.src='https://techcodeview.com/template/assets/images/unnamed.webp'" alt="11 mājienu piemēri literatūrā, dzejā un dzīvē" 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="/lv/blog/">Emuārs </a> </div>
<h4 class="text-sm font-bold text-white leading-tight"> <a href="/lv/11-allusion-examples-literature-13138">11 mājienu piemēri literatūrā, dzejā un dzīvē </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/android-tutorial/92/how-block-youtube-ads-android.webp" onerror="this.onerror=null; this.src='https://techcodeview.com/template/assets/images/unnamed.webp'" alt="Kā bloķēt YouTube reklāmas operētājsistēmā Android" 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="/lv/android-tutorial/">Android Apmācība </a> </div>
<h4 class="text-sm font-bold text-white leading-tight"> <a href="/lv/how-block-youtube-ads-android">Kā bloķēt YouTube reklāmas operētājsistēmā Android </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 Visas Tiesības Aizsargātas |
<a href="//www.techcodeview.com/sv/">techcodeview.com </a> |
<a href="/disclaimer" rel="nofollow noopener noreferrer" target="_blank">Atruna </a> |
<a href="/about-us" rel="nofollow noopener noreferrer" target="_blank">Par Mums </a> |
<a href="/privacy-policy" rel="nofollow noopener noreferrer" target="_blank">Privātuma 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>