{"id":155,"date":"2025-12-22T06:09:01","date_gmt":"2025-12-22T06:09:01","guid":{"rendered":"http:\/\/localhost\/2026\/?p=155"},"modified":"2026-01-07T13:53:19","modified_gmt":"2026-01-07T06:53:19","slug":"bab-1-pengenalan-jquery","status":"publish","type":"post","link":"https:\/\/www.bisasoftware.id\/2026\/bab-1-pengenalan-jquery\/","title":{"rendered":"BAB 1 &#8211; Pengenalan JQuery"},"content":{"rendered":"\n<p class=\"has-medium-font-size\"><strong>Apa itu jQuery?<\/strong><\/p>\n\n\n\n<p>jQuery adalah pustaka JavaScript yang cepat, kecil, dan kaya fitur. jQuery membuat hal-hal seperti penelusuran dan manipulasi dokumen HTML, penanganan peristiwa, animasi, dan Ajax jauh lebih sederhana dengan API yang mudah digunakan dan berfungsi di berbagai browser. Dengan kombinasi fleksibilitas dan kemampuan perluasan, jQuery telah mengubah cara jutaan orang menulis JavaScript.<\/p>\n\n\n\n<p class=\"has-medium-font-size\"><strong>Sekilas<\/strong><br>Penelusuran dan Manipulasi DOM<br>Dapatkan elemen dengan kelas &#8216;continue&#8217; dan ubah HTML-nya menjadi &#8216;Langkah Selanjutnya\u2026&#8217;<\/p>\n\n\n\n<pre class=\"wp-block-code\"><code><code>$( \"button.continue\" ).html( \"Next Step...\" )<\/code><\/code><\/pre>\n\n\n\n<h3 class=\"wp-block-heading\">Event Handling<\/h3>\n\n\n\n<p>Tampilkan elemen #banner-message yang disembunyikan dengan display:none di CSS-nya ketika tombol apa pun di #button-container diklik.<\/p>\n\n\n\n<pre class=\"wp-block-code\"><code><code><strong>var<\/strong> hiddenBox = $( \"#banner-message\" );$( \"#button-container button\" ).on( \"click\", <strong>function<\/strong>( event ) { hiddenBox.show();});<\/code><\/code><\/pre>\n\n\n\n<h3 class=\"wp-block-heading\">Ajax<\/h3>\n\n\n\n<p>Panggil skrip lokal di server\u00a0\/api\/getWeather\u00a0dengan parameter kueri\u00a0zipcode=97201\u00a0dan ganti html elemen\u00a0#weather-temp dengan teks yang dikembalikan.<\/p>\n\n\n\n<pre class=\"wp-block-code\"><code><code>$.ajax({ url: \"\/api\/getWeather\", data: { zipcode: 97201 }, success: <strong>function<\/strong>( result ) { $( \"#weather-temp\" ).html( \"&lt;strong>\" + result + \"&lt;\/strong> degrees\" ); }});<\/code><\/code><\/pre>\n\n\n\n<p>Simulasi JQuery Bisa dipraktekkan menggunakan tools editor di bawah ini :<br>\n<p class=\"codepen\" data-height=\"300\" data-default-tab=\"html,result\" data-slug-hash=\"KwMKEzp\" data-pen-title=\"project\" data-preview=\"true\" data-editable=\"true\" data-user=\"deka-wildan\" style=\"height: 300px; box-sizing: border-box; display: flex; align-items: center; justify-content: center; border: 2px solid; margin: 1em 0; padding: 1em;\">\n      <span>See the Pen <a href=\"https:\/\/codepen.io\/deka-wildan\/pen\/KwMKEzp\">\n  project<\/a> by deka wildan (<a href=\"https:\/\/codepen.io\/deka-wildan\">@deka-wildan<\/a>)\n  on <a href=\"https:\/\/codepen.io\">CodePen<\/a>.<\/span>\n      <\/p>\n      <script async src=\"https:\/\/public.codepenassets.com\/embed\/index.js\"><\/script>\n<\/p>\n","protected":false},"excerpt":{"rendered":"<p>Apa itu jQuery? jQuery adalah pustaka JavaScript yang cepat, kecil, dan kaya fitur. jQuery membuat hal-hal seperti penelusuran dan manipulasi&#8230;<\/p>\n","protected":false},"author":1,"featured_media":0,"comment_status":"open","ping_status":"open","sticky":false,"template":"","format":"standard","meta":{"_kadence_starter_templates_imported_post":false,"_kad_post_transparent":"","_kad_post_title":"","_kad_post_layout":"","_kad_post_sidebar_id":"","_kad_post_content_style":"","_kad_post_vertical_padding":"","_kad_post_feature":"","_kad_post_feature_position":"","_kad_post_header":false,"_kad_post_footer":false,"_kad_post_classname":"","footnotes":""},"categories":[39],"tags":[40],"class_list":["post-155","post","type-post","status-publish","format-standard","hentry","category-tutorial-jquery","tag-tutorial-jquery"],"_links":{"self":[{"href":"https:\/\/www.bisasoftware.id\/2026\/wp-json\/wp\/v2\/posts\/155","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/www.bisasoftware.id\/2026\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/www.bisasoftware.id\/2026\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/www.bisasoftware.id\/2026\/wp-json\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/www.bisasoftware.id\/2026\/wp-json\/wp\/v2\/comments?post=155"}],"version-history":[{"count":7,"href":"https:\/\/www.bisasoftware.id\/2026\/wp-json\/wp\/v2\/posts\/155\/revisions"}],"predecessor-version":[{"id":464,"href":"https:\/\/www.bisasoftware.id\/2026\/wp-json\/wp\/v2\/posts\/155\/revisions\/464"}],"wp:attachment":[{"href":"https:\/\/www.bisasoftware.id\/2026\/wp-json\/wp\/v2\/media?parent=155"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/www.bisasoftware.id\/2026\/wp-json\/wp\/v2\/categories?post=155"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/www.bisasoftware.id\/2026\/wp-json\/wp\/v2\/tags?post=155"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}