<nobr id="ln1sl"></nobr>
The DOM represents it as:
\n<\/p>\n\n
- Document\n - html\n - head\n - title\n - body\n - h1\n - p\n<\/pre>\n\n\n\n\n
\n\n\n \n \n Mengakses DOM<\/strong>\n<\/h3>\n\n
JavaScript menyediakan kaedah untuk memilih dan memanipulasi elemen DOM. <\/p>\n\n
\n \n \n Kaedah Pemilihan Biasa<\/strong>\n<\/h4>\n\n
\n
- \ngetElementById<\/strong>\nMemilih elemen mengikut IDnya.\n<\/li>\n<\/ol>\n\n
const title = document.getElementById(\"title\");\n console.log(title.innerText); \/\/ Output: Hello, DOM!\n<\/pre>\n\n\n\n\n
- \ngetElementsByClassName<\/strong>\nMemilih elemen mengikut nama kelasnya (mengembalikan koleksi).\n<\/li>\n<\/ol>\n\n
const paragraphs = document.getElementsByClassName(\"description\");\n console.log(paragraphs[0].innerText);\n<\/pre>\n\n\n\n\n
- \ngetElementsByTagName<\/strong>\nMemilih elemen mengikut nama tegnya (cth., div, p).\n<\/li>\n<\/ol>\n\n
const headings = document.getElementsByTagName(\"h1\");\n console.log(headings[0].innerText);\n<\/pre>\n\n\n\n\n
- \npemilih pertanyaan<\/strong>\nMemilih elemen pertama yang sepadan dengan pemilih CSS.\n<\/li>\n<\/ol>\n\n
const title = document.querySelector(\"#title\");\n<\/pre>\n\n\n\n\n
- \nquerySelectorAll<\/strong>\nMemilih semua elemen yang sepadan dengan pemilih CSS (mengembalikan NodeList).\n<\/li>\n<\/ol>\n\n
const paragraphs = document.querySelectorAll(\".description\");\n<\/pre>\n\n\n\n\n
\n\n\n \n \n Manipulasi DOM<\/strong>\n<\/h3>\n\n
Setelah dipilih, anda boleh mengubah suai elemen, atribut dan kandungan secara dinamik.<\/p>\n\n
\n \n \n 1. Menukar Kandungan<\/strong>\n<\/h4>\n\n<\/pre>\n
\n
- \ninnerHTML<\/strong>: Menetapkan atau mendapatkan kandungan HTML.\n<\/li>\n<\/ul>\n\n
document.getElementById(\"title\").innerHTML = \"Welcome to the DOM!\";\n<\/pre>\n\n\n\n\n
- \nInnerTeks<\/strong> atau textContent<\/strong>: Menetapkan atau mendapatkan teks biasa.\n<\/li>\n<\/ul>\n\n
document.getElementById(\"title\").innerText = \"Hello, World!\";\n<\/pre>\n\n\n\n\n \n \n 2. Menukar Atribut<\/strong>\n<\/h4>\n\n
\n
- Gunakan setAttribute dan getAttribute untuk mengubah suai atribut elemen.\n<\/li>\n<\/ul>\n\n
const link = document.querySelector(\"a\");\n link.setAttribute(\"href\", \"https:\/\/example.com\");\n<\/pre>\n\n\n\n\n
- Ubah suai secara langsung atribut seperti id, className atau src.\n<\/li>\n<\/ul>\n\n
const image = document.querySelector(\"img\");\n image.src = \"image.jpg\";\n<\/pre>\n\n\n\n\n \n \n 3. Menukar Gaya<\/strong>\n<\/h4>\n\n
Ubah suai sifat CSS secara langsung.
\n<\/p>\n\n\n \nDOM Example<\/title>\n <\/head>\n <body> <h1><a href="http://ipnx.cn/">亚洲国产日韩欧美一区二区三区,精品亚洲国产成人av在线,国产99视频精品免视看7,99国产精品久久久久久久成人热,欧美日韩亚洲国产综合乱</a></h1>\n <h1>\n\n\n\n<p>The DOM represents it as:<br>\n<\/p>\n\n<pre>- Document\n - html\n - head\n - title\n - body\n - h1\n - p\n<\/pre>\n\n\n\n\n<hr>\n\n<h3>\n \n \n <strong>Menambah dan Mengalih Keluar Elemen<\/strong>\n<\/h3>\n\n<h4>\n \n \n <strong>1. Menambah Elemen<\/strong>\n<\/h4>\n\n<\/pre>\n<ul>\n<li>\n<strong>createElement<\/strong>: Mencipta elemen baharu.\n<\/li>\n<li>\n<strong>appendChild<\/strong>: Menambahkan elemen pada ibu bapa.\n<\/li>\n<\/ul>\n\n<pre> const title = document.getElementById(\"title\");\n console.log(title.innerText); \/\/ Output: Hello, DOM!\n<\/pre>\n\n\n\n<h4>\n \n \n <strong>2. Mengalih keluar Elemen<\/strong>\n<\/h4>\n\n<ul>\n<li>\n<strong>removeChild<\/strong>: Mengalih keluar elemen kanak-kanak.\n<\/li>\n<\/ul>\n\n<pre> const paragraphs = document.getElementsByClassName(\"description\");\n console.log(paragraphs[0].innerText);\n<\/pre>\n\n\n\n\n<hr>\n\n<h3>\n \n \n <strong>Pengendalian Acara di DOM<\/strong>\n<\/h3>\n\n<p>Acara ialah tindakan atau kejadian yang dikesan oleh penyemak imbas, seperti klik atau tekanan kekunci. <\/p>\n\n<h4>\n \n \n <strong>Menambah Pendengar Acara<\/strong>\n<\/h4>\n\n<p>Gunakan addEventListener untuk mengikat acara kepada elemen.<br>\n<\/p>\n\n<pre> const headings = document.getElementsByTagName(\"h1\");\n console.log(headings[0].innerText);\n<\/pre>\n\n\n\n<h4>\n \n \n <strong>Acara Biasa<\/strong>\n<\/h4>\n\n<ol>\n<li>\n<strong>Acara Tetikus<\/strong>: klik, dblclick, alih tetikus, keluar tetikus\n<\/li>\n<li>\n<strong>Acara Papan Kekunci<\/strong>: keydown, keyup\n<\/li>\n<li>\n<strong>Borang Acara<\/strong>: serahkan, tukar, fokus\n<\/li>\n<\/ol>\n\n\n<hr>\n\n<h3>\n \n \n <strong>Merentasi DOM<\/strong>\n<\/h3>\n\n<p>Anda boleh menavigasi antara elemen menggunakan perhubungan dalam pepohon DOM.<\/p>\n\n<h4>\n \n \n <strong>Ibu bapa dan Anak<\/strong>\n<\/h4>\n\n<ul>\n<li>\n<strong>parentNode<\/strong>: Mendapatkan nod induk.\n<\/li>\n<li>\n<strong>childNodes<\/strong>: Menyenaraikan semua nod anak.\n<\/li>\n<li>\n<strong>kanak-kanak<\/strong>: Menyenaraikan semua elemen kanak-kanak.\n<\/li>\n<\/ul>\n\n<pre> const title = document.querySelector(\"#title\");\n<\/pre>\n\n\n\n<h4>\n \n \n <strong>Adik beradik<\/strong>\n<\/h4>\n\n<ul>\n<li>\n<strong>nextSibling<\/strong>: Mendapat nod adik beradik seterusnya.\n<\/li>\n<li>\n<strong>Sibling sebelumnya<\/strong>: Mendapat nod adik-beradik sebelumnya.\n<\/li>\n<\/ul>\n\n\n<hr>\n\n<h3>\n \n \n <strong>Ciri DOM Terperinci<\/strong>\n<\/h3>\n\n<h4>\n \n \n <strong>1. Elemen Pengklonan<\/strong>\n<\/h4>\n\n<p>Buat pendua elemen menggunakan cloneNode.<br>\n<\/p>\n\n<pre> const paragraphs = document.querySelectorAll(\".description\");\n<\/pre>\n\n\n\n<h4>\n \n \n <strong>2. Bekerja dengan Kelas<\/strong>\n<\/h4>\n\n<p>Gunakan sifat classList untuk memanipulasi kelas.<br>\n<\/p>\n\n<pre> document.getElementById(\"title\").innerHTML = \"Welcome to the DOM!\";\n<\/pre>\n\n\n\n<h4>\n \n \n <strong>3. Menggunakan Templat<\/strong>\n<\/h4>\n\n<p>Templat HTML membenarkan kandungan boleh diguna semula.<br>\n<\/p>\n\n<pre> document.getElementById(\"title\").innerText = \"Hello, World!\";\n<\/pre>\n\n\n\n\n<hr>\n\n<h3>\n \n \n <strong>Amalan Terbaik untuk Manipulasi DOM<\/strong>\n<\/h3>\n\n<ol>\n<li>\n<p><strong>Meminimumkan Pengaliran Semula dan Mengecat Semula<\/strong>: <\/p>\n\n<ul>\n<li>Perubahan DOM kelompok untuk mengelakkan pemaparan yang berlebihan.\n<\/li>\n<li>Gunakan documentFragment untuk berbilang kemas kini.\n<\/li>\n<\/ul>\n<\/li>\n<li><p><strong>Gunakan Delegasi Acara<\/strong>:<br><br>\nLampirkan acara pada elemen induk dan bukannya elemen anak individu.<br>\n<\/p><\/li>\n<\/ol>\n\n<pre><!DOCTYPE html>\n<html>\n <head>\n <title>DOM Example<\/title>\n <\/head>\n <body>\n <h1>\n\n\n\n<p>The DOM represents it as:<br>\n<\/p>\n\n<pre>- Document\n - html\n - head\n - title\n - body\n - h1\n - p\n<\/pre>\n\n\n\n<ol>\n<li>\n<strong>Elak JavaScript Sebaris<\/strong>:\nGunakan skrip luaran atau addEventListener untuk pemisahan kod yang bersih.<\/li>\n<\/ol>\n\n\n<hr>\n\n<h3>\n \n \n <strong>Kesimpulan<\/strong>\n<\/h3>\n\n<p>JavaScript HTML DOM ialah alat yang berkuasa untuk mencipta halaman web yang dinamik dan interaktif. Dengan menguasai manipulasi DOM, pengendalian acara dan amalan terbaik, pembangun boleh membina aplikasi responsif dan mesra pengguna yang meningkatkan keseluruhan pengalaman pengguna.<\/p>\n\n<p><strong>Hai, saya Abhay Singh Kathayat!<\/strong><br>\nSaya seorang pembangun tindanan penuh dengan kepakaran dalam kedua-dua teknologi hadapan dan belakang. Saya bekerja dengan pelbagai bahasa pengaturcaraan dan rangka kerja untuk membina aplikasi yang cekap, berskala dan mesra pengguna.<br>\nJangan ragu untuk menghubungi saya melalui e-mel perniagaan saya: kaashshorts28@gmail.com.<\/p>\n\n\n \n\n \n <\/pre>"} </script> <meta http-equiv="Cache-Control" content="no-transform" /> <meta http-equiv="Cache-Control" content="no-siteapp" /> <script>var V_PATH="/";window.onerror=function(){ return true; };</script> </head> <body data-commit-time="2023-12-28T14:50:12+08:00" class="editor_body body2_2"> <link rel="stylesheet" type="text/css" href="/static/csshw/stylehw.css"> <header> <div id="wjcelcm34c" class="head"> <div id="wjcelcm34c" class="haed_left"> <div id="wjcelcm34c" class="haed_logo"> <a href="http://ipnx.cn/ms/" title="" class="haed_logo_a"> <img src="/static/imghw/logo.png" alt="" class="haed_logoimg"> </a> </div> <div id="wjcelcm34c" class="head_nav"> <div id="wjcelcm34c" class="head_navs"> <a href="javascript:;" title="masyarakat" class="head_nava head_nava-template1">masyarakat</a> <div class="wjcelcm34c" id="dropdown-template1" style="display: none;"> <div id="wjcelcm34c" class="languagechoose"> <a href="http://ipnx.cn/ms/article.html" title="Artikel" class="languagechoosea on">Artikel</a> <a href="http://ipnx.cn/ms/faq/zt" title="Topik" class="languagechoosea">Topik</a> <a href="http://ipnx.cn/ms/wenda.html" title="Soal Jawab" class="languagechoosea">Soal Jawab</a> </div> </div> </div> <div id="wjcelcm34c" class="head_navs"> <a href="javascript:;" title="Belajar" class="head_nava head_nava-template1_1">Belajar</a> <div class="wjcelcm34c" id="dropdown-template1_1" style="display: none;"> <div id="wjcelcm34c" class="languagechoose"> <a href="http://ipnx.cn/ms/course.html" title="Kursus" class="languagechoosea on">Kursus</a> <a href="http://ipnx.cn/ms/dic/" title="Kamus Pengaturcaraan" class="languagechoosea">Kamus Pengaturcaraan</a> </div> </div> </div> <div id="wjcelcm34c" class="head_navs"> <a href="javascript:;" title="Perpustakaan Alatan" class="head_nava head_nava-template1_2">Perpustakaan Alatan</a> <div class="wjcelcm34c" id="dropdown-template1_2" style="display: none;"> <div id="wjcelcm34c" class="languagechoose"> <a href="http://ipnx.cn/ms/toolset/development-tools" title="Alat pembangunan" class="languagechoosea on">Alat pembangunan</a> <a href="http://ipnx.cn/ms/toolset/website-source-code" title="Kod sumber laman web" class="languagechoosea">Kod sumber laman web</a> <a href="http://ipnx.cn/ms/toolset/php-libraries" title="Perpustakaan PHP" class="languagechoosea">Perpustakaan PHP</a> <a href="http://ipnx.cn/ms/toolset/js-special-effects" title="Kesan khas JS" class="languagechoosea on">Kesan khas JS</a> <a href="http://ipnx.cn/ms/toolset/website-materials" title="Bahan laman web" class="languagechoosea on">Bahan laman web</a> <a href="http://ipnx.cn/ms/toolset/extension-plug-ins" title="Pemalam sambungan" class="languagechoosea on">Pemalam sambungan</a> </div> </div> </div> <div id="wjcelcm34c" class="head_navs"> <a href="http://ipnx.cn/ms/ai" title="Alat AI" class="head_nava head_nava-template1_3">Alat AI</a> </div> <div id="wjcelcm34c" class="head_navs"> <a href="javascript:;" title="Masa lapang" class="head_nava head_nava-template1_3">Masa lapang</a> <div class="wjcelcm34c" id="dropdown-template1_3" style="display: none;"> <div id="wjcelcm34c" class="languagechoose"> <a href="http://ipnx.cn/ms/game" title="Muat Turun Permainan" class="languagechoosea on">Muat Turun Permainan</a> <a href="http://ipnx.cn/ms/mobile-game-tutorial/" title="Tutorial Permainan" class="languagechoosea">Tutorial Permainan</a> </div> </div> </div> </div> </div> <div id="wjcelcm34c" class="head_search"> <input id="key_words" onkeydown="if (event.keyCode == 13) searchs('ms')" class="search-input" type="text" autocomplete="off" name="keywords" required="required" placeholder="Block,address,transaction,news" value=""> <a href="javascript:;" title="cari" onclick="searchs('ms')"><img src="/static/imghw/find.png" alt="cari"></a> </div> <div id="wjcelcm34c" class="head_right"> <div id="wjcelcm34c" class="haed_language"> <a href="javascript:;" class="layui-btn haed_language_btn">Melayu<i class="layui-icon layui-icon-triangle-d"></i></a> <div class="wjcelcm34c" id="dropdown-template" style="display: none;"> <div id="wjcelcm34c" class="languagechoose"> <a href="javascript:setlang('zh-cn');" title="簡體中文" class="languagechoosea">簡體中文</a> <a href="javascript:setlang('en');" title="English" class="languagechoosea">English</a> <a href="javascript:setlang('zh-tw');" title="繁體中文" class="languagechoosea">繁體中文</a> <a href="javascript:setlang('ja');" title="日本語" class="languagechoosea">日本語</a> <a href="javascript:setlang('ko');" title="???" class="languagechoosea">???</a> <a href="javascript:;" title="Melayu" class="languagechoosea">Melayu</a> <a href="javascript:setlang('fr');" title="Fran?ais" class="languagechoosea">Fran?ais</a> <a href="javascript:setlang('de');" title="Deutsch" class="languagechoosea">Deutsch</a> </div> </div> </div> <span id="wjcelcm34c" class="head_right_line"></span> <div style="display: block;" id="login" class="haed_login "> <a href="javascript:;" title="Login" class="haed_logina ">Login</a> </div> <div style="display: block;" id="reg" class="head_signup login"> <a href="javascript:;" title="singup" class="head_signupa">singup</a> </div> </div> </div> </header> <main> <div id="wjcelcm34c" class="Article_Details_main"> <div id="wjcelcm34c" class="Article_Details_main1"> <div id="wjcelcm34c" class="Article_Details_main1M"> <div id="wjcelcm34c" class="phpgenera_Details_mainL1"> <a href="http://ipnx.cn/ms/" title="Rumah" class="phpgenera_Details_mainL1a">Rumah</a> <img src="/static/imghw/top_right.png" alt="" /> <a href="http://ipnx.cn/ms/web-designer.html" class="phpgenera_Details_mainL1a">hujung hadapan web</a> <img src="/static/imghw/top_right.png" alt="" /> <a href="http://ipnx.cn/ms/js-tutorial.html" class="phpgenera_Details_mainL1a">tutorial js</a> <img src="/static/imghw/top_right.png" alt="" /> <span>Menguasai JavaScript HTML DOM: Membina Halaman Web Dinamik dan Interaktif</span> </div> <div id="wjcelcm34c" class="Articlelist_txts"> <div id="wjcelcm34c" class="Articlelist_txts_info"> <h1 class="Articlelist_txts_title">Menguasai JavaScript HTML DOM: Membina Halaman Web Dinamik dan Interaktif</h1> <div id="wjcelcm34c" class="Articlelist_txts_info_head"> <div id="wjcelcm34c" class="author_info"> <a href="http://ipnx.cn/ms/member/1468492.html" class="author_avatar"> <img class="lazy" data-src="https://img.php.cn/upload/avatar/000/000/001/66ea8147b1057383.png" src="/static/imghw/default1.png" alt="Mary-Kate Olsen"> </a> <div id="wjcelcm34c" class="author_detail"> <a href="http://ipnx.cn/ms/member/1468492.html" class="author_name">Mary-Kate Olsen</a> </div> </div> </div> <span id="wjcelcm34c" class="Articlelist_txts_time">Dec 20, 2024 am 02:57 AM</span> </div> </div> <hr /> <div id="wjcelcm34c" class="article_main php-article"> <div id="wjcelcm34c" class="article-list-left detail-content-wrap content"> <ins class="adsbygoogle" style="display:block; text-align:center;" data-ad-layout="in-article" data-ad-format="fluid" data-ad-client="ca-pub-5902227090019525" data-ad-slot="3461856641"> </ins> <p><img src="/static/imghw/default1.png" data-src="https://img.php.cn/upload/article/000/000/000/173463463582725.jpg" class="lazy" alt="Mastering the JavaScript HTML DOM: Building Dynamic and Interactive Webpages"></p> <h3> <strong>JavaScript HTML DOM: Panduan Lengkap</strong> </h3> <p><strong>Model Objek Dokumen (DOM)</strong> ialah antara muka pengaturcaraan untuk dokumen web. Ia mewakili struktur halaman web sebagai pepohon objek, membolehkan pembangun memanipulasi HTML dan CSS menggunakan JavaScript. Dengan menguasai DOM, anda boleh membuat halaman web yang dinamik dan interaktif.</p> <hr> <h3> <strong>Apakah itu DOM?</strong> </h3> <p>DOM ialah perwakilan berstruktur bagi dokumen HTML. Ia membenarkan JavaScript mengakses dan memanipulasi elemen, atribut dan kandungan halaman web secara dinamik. </p> <h4> Contoh: </h4> <p>Untuk HTML ini:<br> </p> <pre class="brush:php;toolbar:false"><!DOCTYPE html> <html> <head> <title>DOM Example</title> </head> <body> <h1> <p>The DOM represents it as:<br> </p> <pre class="brush:php;toolbar:false">- Document - html - head - title - body - h1 - p </pre> <hr> <h3> <strong>Mengakses DOM</strong> </h3> <p>JavaScript menyediakan kaedah untuk memilih dan memanipulasi elemen DOM. </p> <h4> <strong>Kaedah Pemilihan Biasa</strong> </h4> <ol> <li> <strong>getElementById</strong> Memilih elemen mengikut IDnya. </li> </ol> <pre class="brush:php;toolbar:false"> const title = document.getElementById("title"); console.log(title.innerText); // Output: Hello, DOM! </pre> <ol> <li> <strong>getElementsByClassName</strong> Memilih elemen mengikut nama kelasnya (mengembalikan koleksi). </li> </ol> <pre class="brush:php;toolbar:false"> const paragraphs = document.getElementsByClassName("description"); console.log(paragraphs[0].innerText); </pre> <ol> <li> <strong>getElementsByTagName</strong> Memilih elemen mengikut nama tegnya (cth., div, p). </li> </ol> <pre class="brush:php;toolbar:false"> const headings = document.getElementsByTagName("h1"); console.log(headings[0].innerText); </pre> <ol> <li> <strong>pemilih pertanyaan</strong> Memilih elemen pertama yang sepadan dengan pemilih CSS. </li> </ol> <pre class="brush:php;toolbar:false"> const title = document.querySelector("#title"); </pre> <ol> <li> <strong>querySelectorAll</strong> Memilih semua elemen yang sepadan dengan pemilih CSS (mengembalikan NodeList). </li> </ol> <pre class="brush:php;toolbar:false"> const paragraphs = document.querySelectorAll(".description"); </pre> <hr> <h3> <strong>Manipulasi DOM</strong> </h3> <p>Setelah dipilih, anda boleh mengubah suai elemen, atribut dan kandungan secara dinamik.</p> <h4> <strong>1. Menukar Kandungan</strong> </h4> </pre> <ul> <li> <strong>innerHTML</strong>: Menetapkan atau mendapatkan kandungan HTML. </li> </ul> <pre class="brush:php;toolbar:false"> document.getElementById("title").innerHTML = "Welcome to the DOM!"; </pre> <ul> <li> <strong>InnerTeks</strong> atau <strong>textContent</strong>: Menetapkan atau mendapatkan teks biasa. </li> </ul> <pre class="brush:php;toolbar:false"> document.getElementById("title").innerText = "Hello, World!"; </pre> <h4> <strong>2. Menukar Atribut</strong> </h4> <ul> <li>Gunakan setAttribute dan getAttribute untuk mengubah suai atribut elemen. </li> </ul> <pre class="brush:php;toolbar:false"> const link = document.querySelector("a"); link.setAttribute("href", "https://example.com"); </pre> <ul> <li>Ubah suai secara langsung atribut seperti id, className atau src. </li> </ul> <pre class="brush:php;toolbar:false"> const image = document.querySelector("img"); image.src = "image.jpg"; </pre> <h4> <strong>3. Menukar Gaya</strong> </h4> <p>Ubah suai sifat CSS secara langsung.<br> </p> <pre class="brush:php;toolbar:false"><!DOCTYPE html> <html> <head> <title>DOM Example</title> </head> <body> <h1> <p>The DOM represents it as:<br> </p> <pre class="brush:php;toolbar:false">- Document - html - head - title - body - h1 - p </pre> <hr> <h3> <strong>Menambah dan Mengalih Keluar Elemen</strong> </h3> <h4> <strong>1. Menambah Elemen</strong> </h4> </pre> <ul> <li> <strong>createElement</strong>: Mencipta elemen baharu. </li> <li> <strong>appendChild</strong>: Menambahkan elemen pada ibu bapa. </li> </ul> <pre class="brush:php;toolbar:false"> const title = document.getElementById("title"); console.log(title.innerText); // Output: Hello, DOM! </pre> <h4> <strong>2. Mengalih keluar Elemen</strong> </h4> <ul> <li> <strong>removeChild</strong>: Mengalih keluar elemen kanak-kanak. </li> </ul> <pre class="brush:php;toolbar:false"> const paragraphs = document.getElementsByClassName("description"); console.log(paragraphs[0].innerText); </pre> <hr> <h3> <strong>Pengendalian Acara di DOM</strong> </h3> <p>Acara ialah tindakan atau kejadian yang dikesan oleh penyemak imbas, seperti klik atau tekanan kekunci. </p> <h4> <strong>Menambah Pendengar Acara</strong> </h4> <p>Gunakan addEventListener untuk mengikat acara kepada elemen.<br> </p> <pre class="brush:php;toolbar:false"> const headings = document.getElementsByTagName("h1"); console.log(headings[0].innerText); </pre> <h4> <strong>Acara Biasa</strong> </h4> <ol> <li> <strong>Acara Tetikus</strong>: klik, dblclick, alih tetikus, keluar tetikus </li> <li> <strong>Acara Papan Kekunci</strong>: keydown, keyup </li> <li> <strong>Borang Acara</strong>: serahkan, tukar, fokus </li> </ol> <hr> <h3> <strong>Merentasi DOM</strong> </h3> <p>Anda boleh menavigasi antara elemen menggunakan perhubungan dalam pepohon DOM.</p> <h4> <strong>Ibu bapa dan Anak</strong> </h4> <ul> <li> <strong>parentNode</strong>: Mendapatkan nod induk. </li> <li> <strong>childNodes</strong>: Menyenaraikan semua nod anak. </li> <li> <strong>kanak-kanak</strong>: Menyenaraikan semua elemen kanak-kanak. </li> </ul> <pre class="brush:php;toolbar:false"> const title = document.querySelector("#title"); </pre> <h4> <strong>Adik beradik</strong> </h4> <ul> <li> <strong>nextSibling</strong>: Mendapat nod adik beradik seterusnya. </li> <li> <strong>Sibling sebelumnya</strong>: Mendapat nod adik-beradik sebelumnya. </li> </ul> <hr> <h3> <strong>Ciri DOM Terperinci</strong> </h3> <h4> <strong>1. Elemen Pengklonan</strong> </h4> <p>Buat pendua elemen menggunakan cloneNode.<br> </p> <pre class="brush:php;toolbar:false"> const paragraphs = document.querySelectorAll(".description"); </pre> <h4> <strong>2. Bekerja dengan Kelas</strong> </h4> <p>Gunakan sifat classList untuk memanipulasi kelas.<br> </p> <pre class="brush:php;toolbar:false"> document.getElementById("title").innerHTML = "Welcome to the DOM!"; </pre> <h4> <strong>3. Menggunakan Templat</strong> </h4> <p>Templat HTML membenarkan kandungan boleh diguna semula.<br> </p> <pre class="brush:php;toolbar:false"> document.getElementById("title").innerText = "Hello, World!"; </pre> <hr> <h3> <strong>Amalan Terbaik untuk Manipulasi DOM</strong> </h3> <ol> <li> <p><strong>Meminimumkan Pengaliran Semula dan Mengecat Semula</strong>: </p> <ul> <li>Perubahan DOM kelompok untuk mengelakkan pemaparan yang berlebihan. </li> <li>Gunakan documentFragment untuk berbilang kemas kini. </li> </ul> </li> <li><p><strong>Gunakan Delegasi Acara</strong>:<br><br> Lampirkan acara pada elemen induk dan bukannya elemen anak individu.<br> </p></li> </ol> <pre class="brush:php;toolbar:false"><!DOCTYPE html> <html> <head> <title>DOM Example</title> </head> <body> <h1> <p>The DOM represents it as:<br> </p> <pre class="brush:php;toolbar:false">- Document - html - head - title - body - h1 - p </pre> <ol> <li> <strong>Elak JavaScript Sebaris</strong>: Gunakan skrip luaran atau addEventListener untuk pemisahan kod yang bersih.</li> </ol> <hr> <h3> <strong>Kesimpulan</strong> </h3> <p>JavaScript HTML DOM ialah alat yang berkuasa untuk mencipta halaman web yang dinamik dan interaktif. Dengan menguasai manipulasi DOM, pengendalian acara dan amalan terbaik, pembangun boleh membina aplikasi responsif dan mesra pengguna yang meningkatkan keseluruhan pengalaman pengguna.</p> <p><strong>Hai, saya Abhay Singh Kathayat!</strong><br> Saya seorang pembangun tindanan penuh dengan kepakaran dalam kedua-dua teknologi hadapan dan belakang. Saya bekerja dengan pelbagai bahasa pengaturcaraan dan rangka kerja untuk membina aplikasi yang cekap, berskala dan mesra pengguna.<br> Jangan ragu untuk menghubungi saya melalui e-mel perniagaan saya: kaashshorts28@gmail.com.</p> </pre><p>Atas ialah kandungan terperinci Menguasai JavaScript HTML DOM: Membina Halaman Web Dinamik dan Interaktif. Untuk maklumat lanjut, sila ikut artikel berkaitan lain di laman web China PHP!</p> </div> </div> <div id="wjcelcm34c" class="wzconShengming_sp"> <div id="wjcelcm34c" class="bzsmdiv_sp">Kenyataan Laman Web ini</div> <div>Kandungan artikel ini disumbangkan secara sukarela oleh netizen, dan hak cipta adalah milik pengarang asal. Laman web ini tidak memikul tanggungjawab undang-undang yang sepadan. Jika anda menemui sebarang kandungan yang disyaki plagiarisme atau pelanggaran, sila hubungi admin@php.cn</div> </div> </div> <ins class="adsbygoogle" style="display:block" data-ad-format="autorelaxed" data-ad-client="ca-pub-5902227090019525" data-ad-slot="2507867629"></ins> <div id="wjcelcm34c" class="AI_ToolDetails_main4sR"> <ins class="adsbygoogle" style="display:block" data-ad-client="ca-pub-5902227090019525" data-ad-slot="3653428331" data-ad-format="auto" data-full-width-responsive="true"></ins> <!-- <div id="wjcelcm34c" class="phpgenera_Details_mainR4"> <div id="wjcelcm34c" class="phpmain1_4R_readrank"> <div id="wjcelcm34c" class="phpmain1_4R_readrank_top"> <img onerror="this.onerror=''; this.src='/static/imghw/default1.png'" onerror="this.onerror=''; this.src='/static/imghw/default1.png'" src="/static/imghw/hotarticle2.png" alt="" /> <h2>Artikel Panas</h2> </div> <div id="wjcelcm34c" class="phpgenera_Details_mainR4_bottom"> <div id="wjcelcm34c" class="phpgenera_Details_mainR4_bottoms"> <a href="http://ipnx.cn/ms/faq/1796832397.html" title="Panduan Membina Rumput Wonder | Uma Musume Pretty Derby" class="phpgenera_Details_mainR4_bottom_title">Panduan Membina Rumput Wonder | Uma Musume Pretty Derby</a> <div id="wjcelcm34c" class="phpgenera_Details_mainR4_bottoms_info"> <span>3 minggu yang lalu</span> <span>By Jack chen</span> </div> </div> <div id="wjcelcm34c" class="phpgenera_Details_mainR4_bottoms"> <a href="http://ipnx.cn/ms/faq/1796833110.html" title="<??>: 99 Malam di Hutan - Semua Lencana Dan Cara Membuka Kunci Mereka" class="phpgenera_Details_mainR4_bottom_title"><??>: 99 Malam di Hutan - Semua Lencana Dan Cara Membuka Kunci Mereka</a> <div id="wjcelcm34c" class="phpgenera_Details_mainR4_bottoms_info"> <span>3 minggu yang lalu</span> <span>By DDD</span> </div> </div> <div id="wjcelcm34c" class="phpgenera_Details_mainR4_bottoms"> <a href="http://ipnx.cn/ms/faq/1796831605.html" title="Jadual Banner Pretty Derby Uma Musume (Julai 2025)" class="phpgenera_Details_mainR4_bottom_title">Jadual Banner Pretty Derby Uma Musume (Julai 2025)</a> <div id="wjcelcm34c" class="phpgenera_Details_mainR4_bottoms_info"> <span>4 minggu yang lalu</span> <span>By Jack chen</span> </div> </div> <div id="wjcelcm34c" class="phpgenera_Details_mainR4_bottoms"> <a href="http://ipnx.cn/ms/faq/1796829586.html" title="Connections Hitt dan Jawab 3 Julai untuk 753 untuk 753" class="phpgenera_Details_mainR4_bottom_title">Connections Hitt dan Jawab 3 Julai untuk 753 untuk 753</a> <div id="wjcelcm34c" class="phpgenera_Details_mainR4_bottoms_info"> <span>1 bulan yang lalu</span> <span>By Jack chen</span> </div> </div> <div id="wjcelcm34c" class="phpgenera_Details_mainR4_bottoms"> <a href="http://ipnx.cn/ms/faq/1796831905.html" title="Keselamatan Windows kosong atau tidak menunjukkan pilihan" class="phpgenera_Details_mainR4_bottom_title">Keselamatan Windows kosong atau tidak menunjukkan pilihan</a> <div id="wjcelcm34c" class="phpgenera_Details_mainR4_bottoms_info"> <span>4 minggu yang lalu</span> <span>By 下次還敢</span> </div> </div> </div> <div id="wjcelcm34c" class="phpgenera_Details_mainR3_more"> <a href="http://ipnx.cn/ms/article.html">Tunjukkan Lagi</a> </div> </div> </div> --> <div id="wjcelcm34c" class="phpgenera_Details_mainR3"> <div id="wjcelcm34c" class="phpmain1_4R_readrank"> <div id="wjcelcm34c" class="phpmain1_4R_readrank_top"> <img onerror="this.onerror=''; this.src='/static/imghw/default1.png'" onerror="this.onerror=''; this.src='/static/imghw/default1.png'" src="/static/imghw/hottools2.png" alt="" /> <h2>Alat AI Hot</h2> </div> <div id="wjcelcm34c" class="phpgenera_Details_mainR3_bottom"> <div id="wjcelcm34c" class="phpmain_tab2_mids_top"> <a href="http://ipnx.cn/ms/ai/undress-ai-tool" title="Undress AI Tool" class="phpmain_tab2_mids_top_img"> <img onerror="this.onerror=''; this.src='/static/imghw/default1.png'" onerror="this.onerror=''; this.src='/static/imghw/default1.png'" class="lazy" data-src="https://img.php.cn/upload/ai_manual/001/246/273/173410641626608.jpg?x-oss-process=image/resize,m_fill,h_50,w_50" src="/static/imghw/default1.png" alt="Undress AI Tool" /> </a> <div id="wjcelcm34c" class="phpmain_tab2_mids_info"> <a href="http://ipnx.cn/ms/ai/undress-ai-tool" title="Undress AI Tool" class="phpmain_tab2_mids_title"> <h3>Undress AI Tool</h3> </a> <p>Gambar buka pakaian secara percuma</p> </div> </div> <div id="wjcelcm34c" class="phpmain_tab2_mids_top"> <a href="http://ipnx.cn/ms/ai/undresserai-undress" title="Undresser.AI Undress" class="phpmain_tab2_mids_top_img"> <img onerror="this.onerror=''; this.src='/static/imghw/default1.png'" onerror="this.onerror=''; this.src='/static/imghw/default1.png'" class="lazy" data-src="https://img.php.cn/upload/ai_manual/001/246/273/173411540686492.jpg?x-oss-process=image/resize,m_fill,h_50,w_50" src="/static/imghw/default1.png" alt="Undresser.AI Undress" /> </a> <div id="wjcelcm34c" class="phpmain_tab2_mids_info"> <a href="http://ipnx.cn/ms/ai/undresserai-undress" title="Undresser.AI Undress" class="phpmain_tab2_mids_title"> <h3>Undresser.AI Undress</h3> </a> <p>Apl berkuasa AI untuk mencipta foto bogel yang realistik</p> </div> </div> <div id="wjcelcm34c" class="phpmain_tab2_mids_top"> <a href="http://ipnx.cn/ms/ai/ai-clothes-remover" title="AI Clothes Remover" class="phpmain_tab2_mids_top_img"> <img onerror="this.onerror=''; this.src='/static/imghw/default1.png'" onerror="this.onerror=''; this.src='/static/imghw/default1.png'" class="lazy" data-src="https://img.php.cn/upload/ai_manual/001/246/273/173411552797167.jpg?x-oss-process=image/resize,m_fill,h_50,w_50" src="/static/imghw/default1.png" alt="AI Clothes Remover" /> </a> <div id="wjcelcm34c" class="phpmain_tab2_mids_info"> <a href="http://ipnx.cn/ms/ai/ai-clothes-remover" title="AI Clothes Remover" class="phpmain_tab2_mids_title"> <h3>AI Clothes Remover</h3> </a> <p>Alat AI dalam talian untuk mengeluarkan pakaian daripada foto.</p> </div> </div> <div id="wjcelcm34c" class="phpmain_tab2_mids_top"> <a href="http://ipnx.cn/ms/ai/clothoffio" title="Clothoff.io" class="phpmain_tab2_mids_top_img"> <img onerror="this.onerror=''; this.src='/static/imghw/default1.png'" onerror="this.onerror=''; this.src='/static/imghw/default1.png'" class="lazy" data-src="https://img.php.cn/upload/ai_manual/001/246/273/173411529149311.jpg?x-oss-process=image/resize,m_fill,h_50,w_50" src="/static/imghw/default1.png" alt="Clothoff.io" /> </a> <div id="wjcelcm34c" class="phpmain_tab2_mids_info"> <a href="http://ipnx.cn/ms/ai/clothoffio" title="Clothoff.io" class="phpmain_tab2_mids_title"> <h3>Clothoff.io</h3> </a> <p>Penyingkiran pakaian AI</p> </div> </div> <div id="wjcelcm34c" class="phpmain_tab2_mids_top"> <a href="http://ipnx.cn/ms/ai/video-swap" title="Video Face Swap" class="phpmain_tab2_mids_top_img"> <img onerror="this.onerror=''; this.src='/static/imghw/default1.png'" onerror="this.onerror=''; this.src='/static/imghw/default1.png'" class="lazy" data-src="https://img.php.cn/upload/ai_manual/001/246/273/173414504068133.jpg?x-oss-process=image/resize,m_fill,h_50,w_50" src="/static/imghw/default1.png" alt="Video Face Swap" /> </a> <div id="wjcelcm34c" class="phpmain_tab2_mids_info"> <a href="http://ipnx.cn/ms/ai/video-swap" title="Video Face Swap" class="phpmain_tab2_mids_title"> <h3>Video Face Swap</h3> </a> <p>Tukar muka dalam mana-mana video dengan mudah menggunakan alat tukar muka AI percuma kami!</p> </div> </div> </div> <div id="wjcelcm34c" class="phpgenera_Details_mainR3_more"> <a href="http://ipnx.cn/ms/ai">Tunjukkan Lagi</a> </div> </div> </div> <div id="wjcelcm34c" class="phpgenera_Details_mainR4"> <div id="wjcelcm34c" class="phpmain1_4R_readrank"> <div id="wjcelcm34c" class="phpmain1_4R_readrank_top"> <img onerror="this.onerror=''; this.src='/static/imghw/default1.png'" onerror="this.onerror=''; this.src='/static/imghw/default1.png'" src="/static/imghw/hotarticle2.png" alt="" /> <h2>Artikel Panas</h2> </div> <div id="wjcelcm34c" class="phpgenera_Details_mainR4_bottom"> <div id="wjcelcm34c" class="phpgenera_Details_mainR4_bottoms"> <a href="http://ipnx.cn/ms/faq/1796832397.html" title="Panduan Membina Rumput Wonder | Uma Musume Pretty Derby" class="phpgenera_Details_mainR4_bottom_title">Panduan Membina Rumput Wonder | Uma Musume Pretty Derby</a> <div id="wjcelcm34c" class="phpgenera_Details_mainR4_bottoms_info"> <span>3 minggu yang lalu</span> <span>By Jack chen</span> </div> </div> <div id="wjcelcm34c" class="phpgenera_Details_mainR4_bottoms"> <a href="http://ipnx.cn/ms/faq/1796833110.html" title="<??>: 99 Malam di Hutan - Semua Lencana Dan Cara Membuka Kunci Mereka" class="phpgenera_Details_mainR4_bottom_title"><??>: 99 Malam di Hutan - Semua Lencana Dan Cara Membuka Kunci Mereka</a> <div id="wjcelcm34c" class="phpgenera_Details_mainR4_bottoms_info"> <span>3 minggu yang lalu</span> <span>By DDD</span> </div> </div> <div id="wjcelcm34c" class="phpgenera_Details_mainR4_bottoms"> <a href="http://ipnx.cn/ms/faq/1796831605.html" title="Jadual Banner Pretty Derby Uma Musume (Julai 2025)" class="phpgenera_Details_mainR4_bottom_title">Jadual Banner Pretty Derby Uma Musume (Julai 2025)</a> <div id="wjcelcm34c" class="phpgenera_Details_mainR4_bottoms_info"> <span>4 minggu yang lalu</span> <span>By Jack chen</span> </div> </div> <div id="wjcelcm34c" class="phpgenera_Details_mainR4_bottoms"> <a href="http://ipnx.cn/ms/faq/1796829586.html" title="Connections Hitt dan Jawab 3 Julai untuk 753 untuk 753" class="phpgenera_Details_mainR4_bottom_title">Connections Hitt dan Jawab 3 Julai untuk 753 untuk 753</a> <div id="wjcelcm34c" class="phpgenera_Details_mainR4_bottoms_info"> <span>1 bulan yang lalu</span> <span>By Jack chen</span> </div> </div> <div id="wjcelcm34c" class="phpgenera_Details_mainR4_bottoms"> <a href="http://ipnx.cn/ms/faq/1796831905.html" title="Keselamatan Windows kosong atau tidak menunjukkan pilihan" class="phpgenera_Details_mainR4_bottom_title">Keselamatan Windows kosong atau tidak menunjukkan pilihan</a> <div id="wjcelcm34c" class="phpgenera_Details_mainR4_bottoms_info"> <span>4 minggu yang lalu</span> <span>By 下次還敢</span> </div> </div> </div> <div id="wjcelcm34c" class="phpgenera_Details_mainR3_more"> <a href="http://ipnx.cn/ms/article.html">Tunjukkan Lagi</a> </div> </div> </div> <div id="wjcelcm34c" class="phpgenera_Details_mainR3"> <div id="wjcelcm34c" class="phpmain1_4R_readrank"> <div id="wjcelcm34c" class="phpmain1_4R_readrank_top"> <img onerror="this.onerror=''; this.src='/static/imghw/default1.png'" onerror="this.onerror=''; this.src='/static/imghw/default1.png'" src="/static/imghw/hottools2.png" alt="" /> <h2>Alat panas</h2> </div> <div id="wjcelcm34c" class="phpgenera_Details_mainR3_bottom"> <div id="wjcelcm34c" class="phpmain_tab2_mids_top"> <a href="http://ipnx.cn/ms/toolset/development-tools/92" title="Notepad++7.3.1" class="phpmain_tab2_mids_top_img"> <img onerror="this.onerror=''; this.src='/static/imghw/default1.png'" onerror="this.onerror=''; this.src='/static/imghw/default1.png'" class="lazy" data-src="https://img.php.cn/upload/manual/000/000/001/58ab96f0f39f7357.jpg?x-oss-process=image/resize,m_fill,h_50,w_72" src="/static/imghw/default1.png" alt="Notepad++7.3.1" /> </a> <div id="wjcelcm34c" class="phpmain_tab2_mids_info"> <a href="http://ipnx.cn/ms/toolset/development-tools/92" title="Notepad++7.3.1" class="phpmain_tab2_mids_title"> <h3>Notepad++7.3.1</h3> </a> <p>Editor kod yang mudah digunakan dan percuma</p> </div> </div> <div id="wjcelcm34c" class="phpmain_tab2_mids_top"> <a href="http://ipnx.cn/ms/toolset/development-tools/93" title="SublimeText3 versi Cina" class="phpmain_tab2_mids_top_img"> <img onerror="this.onerror=''; this.src='/static/imghw/default1.png'" onerror="this.onerror=''; this.src='/static/imghw/default1.png'" class="lazy" data-src="https://img.php.cn/upload/manual/000/000/001/58ab97a3baad9677.jpg?x-oss-process=image/resize,m_fill,h_50,w_72" src="/static/imghw/default1.png" alt="SublimeText3 versi Cina" /> </a> <div id="wjcelcm34c" class="phpmain_tab2_mids_info"> <a href="http://ipnx.cn/ms/toolset/development-tools/93" title="SublimeText3 versi Cina" class="phpmain_tab2_mids_title"> <h3>SublimeText3 versi Cina</h3> </a> <p>Versi Cina, sangat mudah digunakan</p> </div> </div> <div id="wjcelcm34c" class="phpmain_tab2_mids_top"> <a href="http://ipnx.cn/ms/toolset/development-tools/121" title="Hantar Studio 13.0.1" class="phpmain_tab2_mids_top_img"> <img onerror="this.onerror=''; this.src='/static/imghw/default1.png'" onerror="this.onerror=''; this.src='/static/imghw/default1.png'" class="lazy" data-src="https://img.php.cn/upload/manual/000/000/001/58ab97ecd1ab2670.jpg?x-oss-process=image/resize,m_fill,h_50,w_72" src="/static/imghw/default1.png" alt="Hantar Studio 13.0.1" /> </a> <div id="wjcelcm34c" class="phpmain_tab2_mids_info"> <a href="http://ipnx.cn/ms/toolset/development-tools/121" title="Hantar Studio 13.0.1" class="phpmain_tab2_mids_title"> <h3>Hantar Studio 13.0.1</h3> </a> <p>Persekitaran pembangunan bersepadu PHP yang berkuasa</p> </div> </div> <div id="wjcelcm34c" class="phpmain_tab2_mids_top"> <a href="http://ipnx.cn/ms/toolset/development-tools/469" title="Dreamweaver CS6" class="phpmain_tab2_mids_top_img"> <img onerror="this.onerror=''; this.src='/static/imghw/default1.png'" onerror="this.onerror=''; this.src='/static/imghw/default1.png'" class="lazy" data-src="https://img.php.cn/upload/manual/000/000/001/58d0e0fc74683535.jpg?x-oss-process=image/resize,m_fill,h_50,w_72" src="/static/imghw/default1.png" alt="Dreamweaver CS6" /> </a> <div id="wjcelcm34c" class="phpmain_tab2_mids_info"> <a href="http://ipnx.cn/ms/toolset/development-tools/469" title="Dreamweaver CS6" class="phpmain_tab2_mids_title"> <h3>Dreamweaver CS6</h3> </a> <p>Alat pembangunan web visual</p> </div> </div> <div id="wjcelcm34c" class="phpmain_tab2_mids_top"> <a href="http://ipnx.cn/ms/toolset/development-tools/500" title="SublimeText3 versi Mac" class="phpmain_tab2_mids_top_img"> <img onerror="this.onerror=''; this.src='/static/imghw/default1.png'" onerror="this.onerror=''; this.src='/static/imghw/default1.png'" class="lazy" data-src="https://img.php.cn/upload/manual/000/000/001/58d34035e2757995.png?x-oss-process=image/resize,m_fill,h_50,w_72" src="/static/imghw/default1.png" alt="SublimeText3 versi Mac" /> </a> <div id="wjcelcm34c" class="phpmain_tab2_mids_info"> <a href="http://ipnx.cn/ms/toolset/development-tools/500" title="SublimeText3 versi Mac" class="phpmain_tab2_mids_title"> <h3>SublimeText3 versi Mac</h3> </a> <p>Perisian penyuntingan kod peringkat Tuhan (SublimeText3)</p> </div> </div> </div> <div id="wjcelcm34c" class="phpgenera_Details_mainR3_more"> <a href="http://ipnx.cn/ms/ai">Tunjukkan Lagi</a> </div> </div> </div> <div id="wjcelcm34c" class="phpgenera_Details_mainR4"> <div id="wjcelcm34c" class="phpmain1_4R_readrank"> <div id="wjcelcm34c" class="phpmain1_4R_readrank_top"> <img onerror="this.onerror=''; this.src='/static/imghw/default1.png'" onerror="this.onerror=''; this.src='/static/imghw/default1.png'" src="/static/imghw/hotarticle2.png" alt="" /> <h2>Topik panas</h2> </div> <div id="wjcelcm34c" class="phpgenera_Details_mainR4_bottom"> <div id="wjcelcm34c" class="phpgenera_Details_mainR4_bottoms"> <a href="http://ipnx.cn/ms/faq/laravel-tutori" title="Tutorial Laravel" class="phpgenera_Details_mainR4_bottom_title">Tutorial Laravel</a> <div id="wjcelcm34c" class="phpgenera_Details_mainR4_bottoms_info"> <div id="wjcelcm34c" class="phpgenera_Details_mainR4_bottoms_infos"> <img src="/static/imghw/eyess.png" alt="" /> <span>1597</span> </div> <div id="wjcelcm34c" class="phpgenera_Details_mainR4_bottoms_infos"> <img src="/static/imghw/tiezi.png" alt="" /> <span>29</span> </div> </div> </div> <div id="wjcelcm34c" class="phpgenera_Details_mainR4_bottoms"> <a href="http://ipnx.cn/ms/faq/php-tutorial" title="Tutorial PHP" class="phpgenera_Details_mainR4_bottom_title">Tutorial PHP</a> <div id="wjcelcm34c" class="phpgenera_Details_mainR4_bottoms_info"> <div id="wjcelcm34c" class="phpgenera_Details_mainR4_bottoms_infos"> <img src="/static/imghw/eyess.png" alt="" /> <span>1488</span> </div> <div id="wjcelcm34c" class="phpgenera_Details_mainR4_bottoms_infos"> <img src="/static/imghw/tiezi.png" alt="" /> <span>72</span> </div> </div> </div> <div id="wjcelcm34c" class="phpgenera_Details_mainR4_bottoms"> <a href="http://ipnx.cn/ms/faq/nytminicrosswordanswe" title="Jawapan silang kata NYT mini" class="phpgenera_Details_mainR4_bottom_title">Jawapan silang kata NYT mini</a> <div id="wjcelcm34c" class="phpgenera_Details_mainR4_bottoms_info"> <div id="wjcelcm34c" class="phpgenera_Details_mainR4_bottoms_infos"> <img src="/static/imghw/eyess.png" alt="" /> <span>268</span> </div> <div id="wjcelcm34c" class="phpgenera_Details_mainR4_bottoms_infos"> <img src="/static/imghw/tiezi.png" alt="" /> <span>587</span> </div> </div> </div> <div id="wjcelcm34c" class="phpgenera_Details_mainR4_bottoms"> <a href="http://ipnx.cn/ms/faq/newyorktimesdailybrief" title="Sambungan NYT menunjukkan dan jawapan" class="phpgenera_Details_mainR4_bottom_title">Sambungan NYT menunjukkan dan jawapan</a> <div id="wjcelcm34c" class="phpgenera_Details_mainR4_bottoms_info"> <div id="wjcelcm34c" class="phpgenera_Details_mainR4_bottoms_infos"> <img src="/static/imghw/eyess.png" alt="" /> <span>132</span> </div> <div id="wjcelcm34c" class="phpgenera_Details_mainR4_bottoms_infos"> <img src="/static/imghw/tiezi.png" alt="" /> <span>836</span> </div> </div> </div> </div> <div id="wjcelcm34c" class="phpgenera_Details_mainR3_more"> <a href="http://ipnx.cn/ms/faq/zt">Tunjukkan Lagi</a> </div> </div> </div> </div> </div> <div id="wjcelcm34c" class="Article_Details_main2"> <div id="wjcelcm34c" class="phpgenera_Details_mainL4"> <div id="wjcelcm34c" class="phpmain1_2_top"> <a href="javascript:void(0);" class="phpmain1_2_top_title">Related knowledge<img src="/static/imghw/index2_title2.png" alt="" /></a> </div> <div id="wjcelcm34c" class="phpgenera_Details_mainL4_info"> <div id="wjcelcm34c" class="phphistorical_Version2_mids"> <a href="http://ipnx.cn/ms/faq/1796829560.html" title="Bagaimanakah pengumpulan sampah berfungsi di JavaScript?" class="phphistorical_Version2_mids_img"> <img onerror="this.onerror=''; this.src='/static/imghw/default1.png'" src="/static/imghw/default1.png" class="lazy" data-src="https://img.php.cn/upload/article/001/253/068/175156097152256.jpg?x-oss-process=image/resize,m_fill,h_207,w_330" alt="Bagaimanakah pengumpulan sampah berfungsi di JavaScript?" /> </a> <a href="http://ipnx.cn/ms/faq/1796829560.html" title="Bagaimanakah pengumpulan sampah berfungsi di JavaScript?" class="phphistorical_Version2_mids_title">Bagaimanakah pengumpulan sampah berfungsi di JavaScript?</a> <span id="wjcelcm34c" class="Articlelist_txts_time">Jul 04, 2025 am 12:42 AM</span> <p class="Articlelist_txts_p">Mekanisme pengumpulan sampah JavaScript secara automatik menguruskan memori melalui algoritma pembersihan tag untuk mengurangkan risiko kebocoran ingatan. Enjin melintasi dan menandakan objek aktif dari objek akar, dan tidak bertanda dianggap sebagai sampah dan dibersihkan. Sebagai contoh, apabila objek tidak lagi dirujuk (seperti menetapkan pembolehubah kepada null), ia akan dikeluarkan dalam pusingan seterusnya kitar semula. Punca kebocoran memori yang biasa termasuk: ① Pemasa atau pendengar peristiwa yang tidak jelas; ② Rujukan kepada pembolehubah luaran dalam penutupan; ③ Pembolehubah global terus memegang sejumlah besar data. Enjin V8 mengoptimumkan kecekapan kitar semula melalui strategi seperti kitar semula generasi, penandaan tambahan, kitar semula selari/serentak, dan mengurangkan masa menyekat benang utama. Semasa pembangunan, rujukan global yang tidak perlu harus dielakkan dan persatuan objek harus dihiasi dengan segera untuk meningkatkan prestasi dan kestabilan.</p> </div> <div id="wjcelcm34c" class="phphistorical_Version2_mids"> <a href="http://ipnx.cn/ms/faq/1796836217.html" title="Bagaimana membuat permintaan HTTP di node.js?" class="phphistorical_Version2_mids_img"> <img onerror="this.onerror=''; this.src='/static/imghw/default1.png'" src="/static/imghw/default1.png" class="lazy" data-src="https://img.php.cn/upload/article/001/431/639/175234432058757.jpg?x-oss-process=image/resize,m_fill,h_207,w_330" alt="Bagaimana membuat permintaan HTTP di node.js?" /> </a> <a href="http://ipnx.cn/ms/faq/1796836217.html" title="Bagaimana membuat permintaan HTTP di node.js?" class="phphistorical_Version2_mids_title">Bagaimana membuat permintaan HTTP di node.js?</a> <span id="wjcelcm34c" class="Articlelist_txts_time">Jul 13, 2025 am 02:18 AM</span> <p class="Articlelist_txts_p">Terdapat tiga cara biasa untuk memulakan permintaan HTTP dalam node.js: Gunakan modul terbina dalam, axios, dan nod-fetch. 1. Gunakan modul HTTP/HTTPS terbina dalam tanpa kebergantungan, yang sesuai untuk senario asas, tetapi memerlukan pemprosesan manual jahitan data dan pemantauan ralat, seperti menggunakan https.get () untuk mendapatkan data atau menghantar permintaan pos melalui .write (); 2.AXIOS adalah perpustakaan pihak ketiga berdasarkan janji. Ia mempunyai sintaks ringkas dan fungsi yang kuat, menyokong async/menunggu, penukaran JSON automatik, pemintas, dan lain -lain. Adalah disyorkan untuk memudahkan operasi permintaan tak segerak; 3.Node-Fetch menyediakan gaya yang serupa dengan pengambilan penyemak imbas, berdasarkan janji dan sintaks mudah</p> </div> <div id="wjcelcm34c" class="phphistorical_Version2_mids"> <a href="http://ipnx.cn/ms/faq/1796836292.html" title="Jenis Data JavaScript: Rujukan primitif vs" class="phphistorical_Version2_mids_img"> <img onerror="this.onerror=''; this.src='/static/imghw/default1.png'" src="/static/imghw/default1.png" class="lazy" data-src="https://img.php.cn/upload/article/001/431/639/175234579081669.jpg?x-oss-process=image/resize,m_fill,h_207,w_330" alt="Jenis Data JavaScript: Rujukan primitif vs" /> </a> <a href="http://ipnx.cn/ms/faq/1796836292.html" title="Jenis Data JavaScript: Rujukan primitif vs" class="phphistorical_Version2_mids_title">Jenis Data JavaScript: Rujukan primitif vs</a> <span id="wjcelcm34c" class="Articlelist_txts_time">Jul 13, 2025 am 02:43 AM</span> <p class="Articlelist_txts_p">Jenis data JavaScript dibahagikan kepada jenis primitif dan jenis rujukan. Jenis primitif termasuk rentetan, nombor, boolean, null, undefined, dan simbol. Nilai -nilai tidak berubah dan salinan disalin apabila memberikan nilai, jadi mereka tidak mempengaruhi satu sama lain; Jenis rujukan seperti objek, tatasusunan dan fungsi menyimpan alamat memori, dan pembolehubah menunjuk objek yang sama akan mempengaruhi satu sama lain. Typeof dan Instanceof boleh digunakan untuk menentukan jenis, tetapi memberi perhatian kepada isu -isu sejarah TypeOfNull. Memahami kedua -dua jenis perbezaan ini dapat membantu menulis kod yang lebih stabil dan boleh dipercayai.</p> </div> <div id="wjcelcm34c" class="phphistorical_Version2_mids"> <a href="http://ipnx.cn/ms/faq/1796832745.html" title="Objek Masa JavaScript, seseorang membina eactexe, laman web lebih cepat di Google Chrome, dll." class="phphistorical_Version2_mids_img"> <img onerror="this.onerror=''; this.src='/static/imghw/default1.png'" src="/static/imghw/default1.png" class="lazy" data-src="https://img.php.cn/upload/article/001/246/273/173914572643912.jpg?x-oss-process=image/resize,m_fill,h_207,w_330" alt="Objek Masa JavaScript, seseorang membina eactexe, laman web lebih cepat di Google Chrome, dll." /> </a> <a href="http://ipnx.cn/ms/faq/1796832745.html" title="Objek Masa JavaScript, seseorang membina eactexe, laman web lebih cepat di Google Chrome, dll." class="phphistorical_Version2_mids_title">Objek Masa JavaScript, seseorang membina eactexe, laman web lebih cepat di Google Chrome, dll.</a> <span id="wjcelcm34c" class="Articlelist_txts_time">Jul 08, 2025 pm 02:27 PM</span> <p class="Articlelist_txts_p">Helo, pemaju JavaScript! Selamat datang ke berita JavaScript minggu ini! Minggu ini kami akan memberi tumpuan kepada: Pertikaian tanda dagangan Oracle dengan Deno, objek masa JavaScript baru disokong oleh pelayar, kemas kini Google Chrome, dan beberapa alat pemaju yang kuat. Mari mulakan! Pertikaian tanda dagangan Oracle dengan percubaan Deno Oracle untuk mendaftarkan tanda dagangan "JavaScript" telah menyebabkan kontroversi. Ryan Dahl, pencipta Node.js dan Deno, telah memfailkan petisyen untuk membatalkan tanda dagangan, dan dia percaya bahawa JavaScript adalah standard terbuka dan tidak boleh digunakan oleh Oracle</p> </div> <div id="wjcelcm34c" class="phphistorical_Version2_mids"> <a href="http://ipnx.cn/ms/faq/1796830657.html" title="React vs angular vs vue: Rangka kerja JS mana yang terbaik?" class="phphistorical_Version2_mids_img"> <img onerror="this.onerror=''; this.src='/static/imghw/default1.png'" src="/static/imghw/default1.png" class="lazy" data-src="https://img.php.cn/upload/article/001/431/639/175165349052637.jpg?x-oss-process=image/resize,m_fill,h_207,w_330" alt="React vs angular vs vue: Rangka kerja JS mana yang terbaik?" /> </a> <a href="http://ipnx.cn/ms/faq/1796830657.html" title="React vs angular vs vue: Rangka kerja JS mana yang terbaik?" class="phphistorical_Version2_mids_title">React vs angular vs vue: Rangka kerja JS mana yang terbaik?</a> <span id="wjcelcm34c" class="Articlelist_txts_time">Jul 05, 2025 am 02:24 AM</span> <p class="Articlelist_txts_p">Rangka kerja JavaScript mana yang terbaik? Jawapannya ialah memilih yang paling sesuai mengikut keperluan anda. 1. REACT adalah fleksibel dan bebas, sesuai untuk projek sederhana dan besar yang memerlukan penyesuaian tinggi dan keupayaan seni bina pasukan; 2. Angular menyediakan penyelesaian lengkap, sesuai untuk aplikasi peringkat perusahaan dan penyelenggaraan jangka panjang; 3. Vue mudah digunakan, sesuai untuk projek kecil dan sederhana atau perkembangan pesat. Di samping itu, sama ada terdapat timbunan teknologi sedia ada, saiz pasukan, kitaran hayat projek dan sama ada SSR diperlukan juga faktor penting dalam memilih rangka kerja. Singkatnya, tidak ada kerangka terbaik, pilihan terbaik adalah yang sesuai dengan keperluan anda.</p> </div> <div id="wjcelcm34c" class="phphistorical_Version2_mids"> <a href="http://ipnx.cn/ms/faq/1796829862.html" title="Pemahaman dengan segera menggunakan Ekspresi Fungsi (Iife) dalam JavaScript" class="phphistorical_Version2_mids_img"> <img onerror="this.onerror=''; this.src='/static/imghw/default1.png'" src="/static/imghw/default1.png" class="lazy" data-src="https://img.php.cn/upload/article/001/253/068/175156814092778.jpg?x-oss-process=image/resize,m_fill,h_207,w_330" alt="Pemahaman dengan segera menggunakan Ekspresi Fungsi (Iife) dalam JavaScript" /> </a> <a href="http://ipnx.cn/ms/faq/1796829862.html" title="Pemahaman dengan segera menggunakan Ekspresi Fungsi (Iife) dalam JavaScript" class="phphistorical_Version2_mids_title">Pemahaman dengan segera menggunakan Ekspresi Fungsi (Iife) dalam JavaScript</a> <span id="wjcelcm34c" class="Articlelist_txts_time">Jul 04, 2025 am 02:42 AM</span> <p class="Articlelist_txts_p">IIFE (Segera Dilanjutkan FunctionExpression) adalah ekspresi fungsi yang dilaksanakan dengan segera selepas definisi, digunakan untuk mengasingkan pembolehubah dan mengelakkan mencemarkan skop global. Ia dipanggil dengan membungkus fungsi dalam kurungan untuk menjadikannya ungkapan dan sepasang kurungan segera diikuti olehnya, seperti (fungsi () {/code/}) ();. Penggunaan terasnya termasuk: 1. Elakkan konflik berubah -ubah dan mencegah pertindihan penamaan antara skrip berganda; 2. Buat skop peribadi untuk menjadikan pembolehubah dalaman tidak kelihatan; 3. Kod modular untuk memudahkan permulaan tanpa mendedahkan terlalu banyak pembolehubah. Kaedah penulisan biasa termasuk versi yang diluluskan dengan parameter dan versi fungsi anak panah ES6, tetapi perhatikan bahawa ungkapan dan ikatan mesti digunakan.</p> </div> <div id="wjcelcm34c" class="phphistorical_Version2_mids"> <a href="http://ipnx.cn/ms/faq/1796832608.html" title="Mengendalikan Janji: Chaining, Pengendalian Kesalahan, dan Janji Gabungan di JavaScript" class="phphistorical_Version2_mids_img"> <img onerror="this.onerror=''; this.src='/static/imghw/default1.png'" src="/static/imghw/default1.png" class="lazy" data-src="https://img.php.cn/upload/article/001/253/068/175191360175213.jpg?x-oss-process=image/resize,m_fill,h_207,w_330" alt="Mengendalikan Janji: Chaining, Pengendalian Kesalahan, dan Janji Gabungan di JavaScript" /> </a> <a href="http://ipnx.cn/ms/faq/1796832608.html" title="Mengendalikan Janji: Chaining, Pengendalian Kesalahan, dan Janji Gabungan di JavaScript" class="phphistorical_Version2_mids_title">Mengendalikan Janji: Chaining, Pengendalian Kesalahan, dan Janji Gabungan di JavaScript</a> <span id="wjcelcm34c" class="Articlelist_txts_time">Jul 08, 2025 am 02:40 AM</span> <p class="Articlelist_txts_p">Janji adalah mekanisme teras untuk mengendalikan operasi tak segerak dalam JavaScript. Memahami panggilan rantaian, pengendalian ralat dan gabungan adalah kunci untuk menguasai aplikasi mereka. 1. Panggilan rantai mengembalikan janji baru melalui .then () untuk merealisasikan persamaan proses tak segerak. Setiap .then () menerima hasil sebelumnya dan boleh mengembalikan nilai atau janji; 2. Pengendalian ralat harus menggunakan .catch () untuk menangkap pengecualian untuk mengelakkan kegagalan senyap, dan boleh mengembalikan nilai lalai dalam tangkapan untuk meneruskan proses; 3. Gabungan seperti janji.all () (berjaya hanya berjaya selepas semua kejayaan), janji.race () (penyempurnaan pertama dikembalikan) dan janji.allsettled () (menunggu semua penyelesaian)</p> </div> <div id="wjcelcm34c" class="phphistorical_Version2_mids"> <a href="http://ipnx.cn/ms/faq/1796832618.html" title="Apakah API cache dan bagaimana ia digunakan dengan pekerja perkhidmatan?" class="phphistorical_Version2_mids_img"> <img onerror="this.onerror=''; this.src='/static/imghw/default1.png'" src="/static/imghw/default1.png" class="lazy" data-src="https://img.php.cn/upload/article/001/253/068/175191380054750.jpg?x-oss-process=image/resize,m_fill,h_207,w_330" alt="Apakah API cache dan bagaimana ia digunakan dengan pekerja perkhidmatan?" /> </a> <a href="http://ipnx.cn/ms/faq/1796832618.html" title="Apakah API cache dan bagaimana ia digunakan dengan pekerja perkhidmatan?" class="phphistorical_Version2_mids_title">Apakah API cache dan bagaimana ia digunakan dengan pekerja perkhidmatan?</a> <span id="wjcelcm34c" class="Articlelist_txts_time">Jul 08, 2025 am 02:43 AM</span> <p class="Articlelist_txts_p">CACHEAPI adalah alat yang disediakan oleh penyemak imbas kepada permintaan rangkaian cache, yang sering digunakan bersempena dengan ServiceWorker untuk meningkatkan prestasi laman web dan pengalaman luar talian. 1. Ia membolehkan pemaju menyimpan sumber secara manual seperti skrip, helaian gaya, gambar, dan lain -lain; 2. Ia boleh memadankan tindak balas cache mengikut permintaan; 3. Ia menyokong memotong cache tertentu atau membersihkan seluruh cache; 4. Ia boleh melaksanakan keutamaan cache atau strategi keutamaan rangkaian melalui perkhidmatan pekerja yang mendengar acara mengambil; 5. Ia sering digunakan untuk sokongan luar talian, mempercepat kelajuan akses berulang, sumber utama dan kandungan kemas kini latar belakang; 6. Apabila menggunakannya, anda perlu memberi perhatian kepada kawalan versi cache, sekatan penyimpanan dan perbezaan dari mekanisme caching HTTP.</p> </div> </div> <a href="http://ipnx.cn/ms/web-designer.html" class="phpgenera_Details_mainL4_botton"> <span>See all articles</span> <img src="/static/imghw/down_right.png" alt="" /> </a> </div> </div> </div> </main> <footer> <div id="wjcelcm34c" class="footer"> <div id="wjcelcm34c" class="footertop"> <img src="/static/imghw/logo.png" alt=""> <p>Latihan PHP dalam talian kebajikan awam，Bantu pelajar PHP berkembang dengan cepat！</p> </div> <div id="wjcelcm34c" class="footermid"> <a href="http://ipnx.cn/ms/about/us.html">Tentang kita</a> <a href="http://ipnx.cn/ms/about/disclaimer.html">Penafian</a> <a href="http://ipnx.cn/ms/update/article_0_1.html">Sitemap</a> </div> <div id="wjcelcm34c" class="footerbottom"> <p> ? php.cn All rights reserved </p> </div> </div> </footer> <input type="hidden" id="verifycode" value="/captcha.html"> <link rel='stylesheet' id='_main-css' href='/static/css/viewer.min.css?2' type='text/css' media='all' /> <footer> <div class="friendship-link"> <p>感谢您访问我们的网站，您可能还对以下资源感兴趣：</p> <a href="http://ipnx.cn/" title="亚洲国产日韩欧美一区二区三区">亚洲国产日韩欧美一区二区三区</a> <div class="friend-links"> </div> </div> </footer> <script> (function(){ var bp = document.createElement('script'); var curProtocol = window.location.protocol.split(':')[0]; if (curProtocol === 'https') { bp.src = 'https://zz.bdstatic.com/linksubmit/push.js'; } else { bp.src = 'http://push.zhanzhang.baidu.com/push.js'; } var s = document.getElementsByTagName("script")[0]; s.parentNode.insertBefore(bp, s); })(); </script> </body><div id="vwi91" class="pl_css_ganrao" style="display: none;"><object id="vwi91"><style id="vwi91"><code id="vwi91"><strong id="vwi91"></strong></code></style></object><em id="vwi91"></em><strong id="vwi91"></strong><address id="vwi91"></address><small id="vwi91"><noframes id="vwi91"></noframes></small><ins id="vwi91"><sup id="vwi91"><div id="vwi91"><dl id="vwi91"></dl></div></sup></ins><ruby id="vwi91"></ruby><tt id="vwi91"><progress id="vwi91"></progress></tt><dl id="vwi91"></dl><listing id="vwi91"><u id="vwi91"></u></listing><progress id="vwi91"><menuitem id="vwi91"></menuitem></progress><meter id="vwi91"></meter><b id="vwi91"><em id="vwi91"><dfn id="vwi91"><strong id="vwi91"></strong></dfn></em></b><video id="vwi91"><em id="vwi91"><ul id="vwi91"><thead id="vwi91"></thead></ul></em></video><label id="vwi91"></label><pre id="vwi91"><span id="vwi91"><legend id="vwi91"></legend></span></pre><pre id="vwi91"></pre><div id="vwi91"></div><del id="vwi91"></del><dfn id="vwi91"></dfn><legend id="vwi91"></legend><em id="vwi91"><noframes id="vwi91"></noframes></em><td id="vwi91"></td><acronym id="vwi91"><dfn id="vwi91"></dfn></acronym><track id="vwi91"><small id="vwi91"></small></track><strong id="vwi91"></strong><strike id="vwi91"></strike><label id="vwi91"></label><menuitem id="vwi91"></menuitem><blockquote id="vwi91"></blockquote><abbr id="vwi91"></abbr><table id="vwi91"><video id="vwi91"></video></table><font id="vwi91"></font><tr id="vwi91"><abbr id="vwi91"><th id="vwi91"><abbr id="vwi91"></abbr></th></abbr></tr><em id="vwi91"><samp id="vwi91"><form id="vwi91"><th id="vwi91"></th></form></samp></em><code id="vwi91"></code><acronym id="vwi91"><legend id="vwi91"><var id="vwi91"><label id="vwi91"></label></var></legend></acronym><nobr id="vwi91"><dfn id="vwi91"></dfn></nobr><strike id="vwi91"><dl id="vwi91"></dl></strike><sup id="vwi91"><big id="vwi91"></big></sup><span id="vwi91"></span><source id="vwi91"><legend id="vwi91"><ol id="vwi91"><tfoot id="vwi91"></tfoot></ol></legend></source><legend id="vwi91"></legend><ol id="vwi91"></ol><rt id="vwi91"><strong id="vwi91"></strong></rt><label id="vwi91"></label><pre id="vwi91"><menuitem id="vwi91"><span id="vwi91"><thead id="vwi91"></thead></span></menuitem></pre><delect id="vwi91"><dfn id="vwi91"></dfn></delect><td id="vwi91"><ol id="vwi91"></ol></td><strike id="vwi91"></strike><menu id="vwi91"><tbody id="vwi91"><tr id="vwi91"><em id="vwi91"></em></tr></tbody></menu><sub id="vwi91"></sub><form id="vwi91"></form><nobr id="vwi91"></nobr><wbr id="vwi91"><th id="vwi91"><label id="vwi91"><abbr id="vwi91"></abbr></label></th></wbr><span id="vwi91"></span><th id="vwi91"><u id="vwi91"></u></th><strike id="vwi91"></strike><dd id="vwi91"><meter id="vwi91"><samp id="vwi91"><mark id="vwi91"></mark></samp></meter></dd><mark id="vwi91"><legend id="vwi91"><s id="vwi91"></s></legend></mark><dl id="vwi91"></dl><dfn id="vwi91"></dfn><tr id="vwi91"><menuitem id="vwi91"></menuitem></tr><listing id="vwi91"></listing><optgroup id="vwi91"><track id="vwi91"></track></optgroup><sub id="vwi91"><ol id="vwi91"><i id="vwi91"><label id="vwi91"></label></i></ol></sub><u id="vwi91"><tt id="vwi91"><mark id="vwi91"><form id="vwi91"></form></mark></tt></u><pre id="vwi91"><legend id="vwi91"><s id="vwi91"></s></legend></pre><thead id="vwi91"><label id="vwi91"><pre id="vwi91"></pre></label></thead><label id="vwi91"><em id="vwi91"><tr id="vwi91"><ruby id="vwi91"></ruby></tr></em></label><strong id="vwi91"><nav id="vwi91"></nav></strong><acronym id="vwi91"></acronym><acronym id="vwi91"><tr id="vwi91"><strike id="vwi91"></strike></tr></acronym><em id="vwi91"></em><td id="vwi91"><s id="vwi91"><var id="vwi91"></var></s></td><thead id="vwi91"></thead><dl id="vwi91"><small id="vwi91"></small></dl><option id="vwi91"><ins id="vwi91"><address id="vwi91"><acronym id="vwi91"></acronym></address></ins></option><sup id="vwi91"></sup><tr id="vwi91"></tr><code id="vwi91"><abbr id="vwi91"><tt id="vwi91"><ul id="vwi91"></ul></tt></abbr></code><listing id="vwi91"><optgroup id="vwi91"><track id="vwi91"><b id="vwi91"></b></track></optgroup></listing><address id="vwi91"></address><bdo id="vwi91"><table id="vwi91"></table></bdo><pre id="vwi91"><label id="vwi91"><code id="vwi91"></code></label></pre><strong id="vwi91"></strong><tfoot id="vwi91"><form id="vwi91"></form></tfoot><blockquote id="vwi91"><span id="vwi91"><ol id="vwi91"></ol></span></blockquote><menuitem id="vwi91"><span id="vwi91"></span></menuitem><legend id="vwi91"><s id="vwi91"><var id="vwi91"></var></s></legend><del id="vwi91"><kbd id="vwi91"><tr id="vwi91"><abbr id="vwi91"></abbr></tr></kbd></del><video id="vwi91"><tfoot id="vwi91"><progress id="vwi91"><del id="vwi91"></del></progress></tfoot></video><em id="vwi91"></em><meter id="vwi91"><del id="vwi91"><ul id="vwi91"></ul></del></meter><optgroup id="vwi91"><rp id="vwi91"></rp></optgroup><strong id="vwi91"><cite id="vwi91"><fieldset id="vwi91"><dl id="vwi91"></dl></fieldset></cite></strong><noframes id="vwi91"><ruby id="vwi91"></ruby></noframes><form id="vwi91"><font id="vwi91"><em id="vwi91"></em></font></form><small id="vwi91"></small><dfn id="vwi91"><ruby id="vwi91"></ruby></dfn><ruby id="vwi91"><meter id="vwi91"><address id="vwi91"></address></meter></ruby><thead id="vwi91"></thead><object id="vwi91"></object><nobr id="vwi91"><del id="vwi91"><ruby id="vwi91"><rp id="vwi91"></rp></ruby></del></nobr><mark id="vwi91"></mark><pre id="vwi91"><center id="vwi91"><legend id="vwi91"></legend></center></pre><kbd id="vwi91"><tr id="vwi91"></tr></kbd><font id="vwi91"><meter id="vwi91"><address id="vwi91"><strike id="vwi91"></strike></address></meter></font><delect id="vwi91"><pre id="vwi91"></pre></delect><wbr id="vwi91"></wbr><strike id="vwi91"><rt id="vwi91"></rt></strike><em id="vwi91"><menuitem id="vwi91"><center id="vwi91"><dl id="vwi91"></dl></center></menuitem></em><fieldset id="vwi91"><legend id="vwi91"></legend></fieldset><sub id="vwi91"></sub><dfn id="vwi91"></dfn><var id="vwi91"><optgroup id="vwi91"></optgroup></var><strong id="vwi91"><var id="vwi91"><strong id="vwi91"></strong></var></strong><center id="vwi91"></center><option id="vwi91"></option><optgroup id="vwi91"><nav id="vwi91"></nav></optgroup><track id="vwi91"><nobr id="vwi91"><code id="vwi91"></code></nobr></track><cite id="vwi91"><sup id="vwi91"><ol id="vwi91"><dl id="vwi91"></dl></ol></sup></cite><font id="vwi91"></font><output id="vwi91"><pre id="vwi91"><menuitem id="vwi91"></menuitem></pre></output><u id="vwi91"><rp id="vwi91"><em id="vwi91"></em></rp></u><menuitem id="vwi91"><center id="vwi91"><tfoot id="vwi91"></tfoot></center></menuitem><strike id="vwi91"><ins id="vwi91"></ins></strike><big id="vwi91"></big><fieldset id="vwi91"><ol id="vwi91"></ol></fieldset><sub id="vwi91"><rp id="vwi91"></rp></sub><style id="vwi91"><nobr id="vwi91"></nobr></style><label id="vwi91"></label><source id="vwi91"><p id="vwi91"></p></source><track id="vwi91"></track><big id="vwi91"></big><output id="vwi91"><meter id="vwi91"></meter></output><table id="vwi91"></table><strike id="vwi91"><dl id="vwi91"><acronym id="vwi91"><p id="vwi91"></p></acronym></dl></strike><code id="vwi91"><optgroup id="vwi91"><ruby id="vwi91"><tt id="vwi91"></tt></ruby></optgroup></code><s id="vwi91"></s><dfn id="vwi91"><li id="vwi91"></li></dfn><span id="vwi91"><ol id="vwi91"><source id="vwi91"></source></ol></span><legend id="vwi91"></legend><button id="vwi91"><b id="vwi91"></b></button><th id="vwi91"><listing id="vwi91"></listing></th><s id="vwi91"><code id="vwi91"><form id="vwi91"></form></code></s><li id="vwi91"></li><blockquote id="vwi91"><video id="vwi91"></video></blockquote><noframes id="vwi91"><abbr id="vwi91"></abbr></noframes><dl id="vwi91"></dl></div> </html>