\n
\n
\n ? method=\"POST\" ?
\n ? action=\"#CGI.SCRIPT_NAME#<\/cfoutput>\">
\n
\n ?

1<\/p>

2<\/p>

3<\/p>

4<\/p>

5<\/p> ?
\n ?

6<\/p>

7<\/p>

8<\/p>

9<\/p>

10<\/p>
\n
\n ?



\n
\n ?
\n ? Name: #FORM.name#<\/cfoutput>\">
\n ? <\/nobr>
\n
\n ?

\n ? ?
\n ?

11<\/p>

12<\/p>

13<\/p>

14<\/p>

15<\/p> ?
\n ?

16<\/p>

17<\/p>

18<\/p>

19<\/p>

20<\/p>
\n
\n<\/form>
\n
\n<\/body>
\n<\/html><\/pre>\n\n

Cette page de formulaire ne fait rien de spécial pour le moment. Il repose simplement vers lui-même, passant le paramètre de nom. J'ai codé les paragraphes et les nombres afin que nous ayons du contenu défilent sur la page, et que nous ayons un guide visuel pour aider à juger jusqu'où la page s'est déroulée verticalement (notez que ce script préservera le défilement vertical et horizontal, cependant). <\/p>\n

Trouver le parchemin <\/h5>\n\n\n\n

La première étape consiste à ajouter du javascript pour obtenir les valeurs X et Y de défilement et les mettre dans le formulaire. Pour ce faire, nous devrons ajouter deux entrées cachées à notre formulaire ainsi que quelques lignes de JavaScript qui saisiront les valeurs de défilement actuelles lorsque le formulaire est soumis et les transmettra aux entrées cachées. La fonction SaveScrollCoOrdineats () examinera la prise en charge du navigateur pour le document. tout et utiliseront les références correctes pour saisir les valeurs de défilement et mettre à jour les entrées de formulaire en conséquence. Nous utiliserons le gestionnaire d'événements onSubmit () sous notre forme pour l'appeler dans cet exemple. <\/p>\n\n

J'ai codé les champs cachés qui stockent les valeurs de défilement en tant que champs de texte dans cet exemple, donc si vous avez des yeux rapides, vous pouvez regarder comment les valeurs changent avant la soumission du formulaire. <\/p>\n\n

 
\n
\n
\n
\n ? Test<\/title> <br>\n<\/head> <br>\n<body> <h1><a href="http://www.miracleart.cn/">国产av日韩一区二区三区精品,成人性爱视频在线观看,国产,欧美,日韩,一区,www.成色av久久成人,2222eeee成人天堂</a></h1> <br>\n <br>\n<form name=\"Form1\" ?<br>\n ? method=\"POST\" ?<br>\n ? action=\"<cfoutput>#CGI.SCRIPT_NAME#<\/cfoutput>\"> <br>\n <br>\n ? <p>1<\/p> <p>2<\/p> <p>3<\/p> <p>4<\/p> <p>5<\/p> ?<br>\n ? <p>6<\/p> <p>7<\/p> <p>8<\/p> <p>9<\/p> <p>10<\/p> <br>\n <br>\n ? <hr width=\"2000\"> <br>\n <br>\n ? <nobr> <br>\n ? Name: <input type=\"text\" name=\"name\" value=\"<cfoutput>#FORM.name#<\/cfoutput>\"> <br>\n ? <input type=\"submit\" value=\"Submit\"><\/nobr> <br>\n <br>\n ? <hr width=\"2000\"> <br>\n ? ?<br>\n ? <p>11<\/p> <p>12<\/p> <p>13<\/p> <p>14<\/p> <p>15<\/p> ?<br>\n ? <p>16<\/p> <p>17<\/p> <p>18<\/p> <p>19<\/p> <p>20<\/p> <br>\n <br>\n<\/form> <br>\n <br>\n<\/body> <br>\n<\/html><\/pre>\n\n<p> La deuxième étape consiste à prendre les valeurs qui sont passées avec la forme et à faire quelque chose avec elles. Pour cela, nous devrons ajouter quelques lignes de JavaScript avec juste une touche de Coldfusion. Tout d'abord, nous insérerons deux balises CFPARAM supplémentaires en haut de la page afin que nous ayons des valeurs de défilement par défaut avec lesquelles travailler sur chaque page de page. Ensuite, nous définirons la fonction ScrollToCoOrdineats () pour définir le défilement de la page et l'appeler lorsque la page se charge à l'aide du gestionnaire d'événements Onload () dans la balise <\/p>. \n\n<pre><cfparam name=\"FORM.name\" default=\"Testing\"> <br>\n <br>\n<html> <br>\n<head> <br>\n ? <title>Test<\/title> <br>\n <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="377j5v51b" class="head"> <div id="377j5v51b" class="haed_left"> <div id="377j5v51b" class="haed_logo"> <a href="http://www.miracleart.cn/fr/" title="" class="haed_logo_a"> <img src="/static/imghw/logo.png" alt="" class="haed_logoimg"> </a> </div> <div id="377j5v51b" class="head_nav"> <div id="377j5v51b" class="head_navs"> <a href="javascript:;" title="communauté" class="head_nava head_nava-template1">communauté</a> <div class="377j5v51b" id="dropdown-template1" style="display: none;"> <div id="377j5v51b" class="languagechoose"> <a href="http://www.miracleart.cn/fr/article.html" title="Articles" class="languagechoosea on">Articles</a> <a href="http://www.miracleart.cn/fr/faq/zt" title="Sujets" class="languagechoosea">Sujets</a> <a href="http://www.miracleart.cn/fr/wenda.html" title="Questions et réponses" class="languagechoosea">Questions et réponses</a> </div> </div> </div> <div id="377j5v51b" class="head_navs"> <a href="javascript:;" title="Apprendre" class="head_nava head_nava-template1_1">Apprendre</a> <div class="377j5v51b" id="dropdown-template1_1" style="display: none;"> <div id="377j5v51b" class="languagechoose"> <a href="http://www.miracleart.cn/fr/course.html" title="Cours" class="languagechoosea on">Cours</a> <a href="http://www.miracleart.cn/fr/dic/" title="Dictionnaire de programmation" class="languagechoosea">Dictionnaire de programmation</a> </div> </div> </div> <div id="377j5v51b" class="head_navs"> <a href="javascript:;" title="Bibliothèque d'outils" class="head_nava head_nava-template1_2">Bibliothèque d'outils</a> <div class="377j5v51b" id="dropdown-template1_2" style="display: none;"> <div id="377j5v51b" class="languagechoose"> <a href="http://www.miracleart.cn/fr/toolset/development-tools" title="Outils de développement" class="languagechoosea on">Outils de développement</a> <a href="http://www.miracleart.cn/fr/toolset/website-source-code" title="Code source du site Web" class="languagechoosea">Code source du site Web</a> <a href="http://www.miracleart.cn/fr/toolset/php-libraries" title="Bibliothèques PHP" class="languagechoosea">Bibliothèques PHP</a> <a href="http://www.miracleart.cn/fr/toolset/js-special-effects" title="Effets spéciaux JS" class="languagechoosea on">Effets spéciaux JS</a> <a href="http://www.miracleart.cn/fr/toolset/website-materials" title="Matériel du site Web" class="languagechoosea on">Matériel du site Web</a> <a href="http://www.miracleart.cn/fr/toolset/extension-plug-ins" title="Plugins d'extension" class="languagechoosea on">Plugins d'extension</a> </div> </div> </div> <div id="377j5v51b" class="head_navs"> <a href="http://www.miracleart.cn/fr/ai" title="Outils d'IA" class="head_nava head_nava-template1_3">Outils d'IA</a> </div> <div id="377j5v51b" class="head_navs"> <a href="javascript:;" title="Loisirs" class="head_nava head_nava-template1_3">Loisirs</a> <div class="377j5v51b" id="dropdown-template1_3" style="display: none;"> <div id="377j5v51b" class="languagechoose"> <a href="http://www.miracleart.cn/fr/game" title="Téléchargement du jeu" class="languagechoosea on">Téléchargement du jeu</a> <a href="http://www.miracleart.cn/fr/mobile-game-tutorial/" title="Tutoriels de jeu" class="languagechoosea">Tutoriels de jeu</a> </div> </div> </div> </div> </div> <div id="377j5v51b" class="head_search"> <input id="key_words" onkeydown="if (event.keyCode == 13) searchs('fr')" class="search-input" type="text" autocomplete="off" name="keywords" required="required" placeholder="Block,address,transaction,news" value=""> <a href="javascript:;" title="recherche" onclick="searchs('fr')"><img src="/static/imghw/find.png" alt="recherche"></a> </div> <div id="377j5v51b" class="head_right"> <div id="377j5v51b" class="haed_language"> <a href="javascript:;" class="layui-btn haed_language_btn">Fran?ais<i class="layui-icon layui-icon-triangle-d"></i></a> <div class="377j5v51b" id="dropdown-template" style="display: none;"> <div id="377j5v51b" 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:setlang('ms');" title="Melayu" class="languagechoosea">Melayu</a> <a href="javascript:;" title="Fran?ais" class="languagechoosea">Fran?ais</a> <a href="javascript:setlang('de');" title="Deutsch" class="languagechoosea">Deutsch</a> </div> </div> </div> <span id="377j5v51b" 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="377j5v51b" class="Article_Details_main"> <div id="377j5v51b" class="Article_Details_main1"> <div id="377j5v51b" class="Article_Details_main1L"> <div id="377j5v51b" class="Article_Details_main1Lmain" id="Article_Details_main1Lmain"> <div id="377j5v51b" class="Article_Details_main1L1">Table des matières</div> <div id="377j5v51b" class="Article_Details_main1L2" id="Article_Details_main1L2"> <!-- 左側(cè)懸浮,文章定位標(biāo)題1 id="Article_Details_main1L2s_1"--> <div id="377j5v51b" class="Article_Details_main1L2s "> <a href="#La-solution" title=" La solution " > La solution </a> </div> <div id="377j5v51b" class="Article_Details_main1L2s "> <a href="#le-code-de-formulaire" title=" le code de formulaire " > le code de formulaire </a> </div> <div id="377j5v51b" class="Article_Details_main1L2s "> <a href="#Trouver-le-parchemin" title=" Trouver le parchemin " > Trouver le parchemin </a> </div> <div id="377j5v51b" class="Article_Details_main1L2s "> <a href="#Envelopper" title=" Envelopper " > Envelopper </a> </div> <div id="377j5v51b" class="Article_Details_main1L2s "> <a href="#Questions-fréquemment-posées-sur-la-préservation-de-la-position-de-défilement-de-la-page" title=" Questions fréquemment posées sur la préservation de la position de défilement de la page " > Questions fréquemment posées sur la préservation de la position de défilement de la page </a> </div> <div id="377j5v51b" class="Article_Details_main1L2s "> <a href="#Comment-puis-je-préserver-la-position-de-défilement-d-une-page-à-l-aide-de-CSS" title=" Comment puis-je préserver la position de défilement d'une page à l'aide de CSS? " > Comment puis-je préserver la position de défilement d'une page à l'aide de CSS? </a> </div> <div id="377j5v51b" class="Article_Details_main1L2s "> <a href="#Quel-est-le-r?le-de-JavaScript-dans-la-préservation-de-la-position-de-défilement" title=" Quel est le r?le de JavaScript dans la préservation de la position de défilement? " > Quel est le r?le de JavaScript dans la préservation de la position de défilement? </a> </div> <div id="377j5v51b" class="Article_Details_main1L2s "> <a href="#Comment-puis-je-modifier-la-position-de-la-barre-de-défilement-à-l-aide-de-CSS" title=" Comment puis-je modifier la position de la barre de défilement à l'aide de CSS? " > Comment puis-je modifier la position de la barre de défilement à l'aide de CSS? </a> </div> <div id="377j5v51b" class="Article_Details_main1L2s "> <a href="#Quelle-est-la-propriété-de-défilement-de-défilement-de-Scroll-margin-inline-dans-le-sens-CSS-Cette-propriété-est-particulièrement-utile-lorsque-vous-souhaitez-contr?ler-l-alignement-des-instantanés-de-défilement" title=" Quelle est la propriété de défilement de défilement de Scroll-margin-inline dans le sens CSS? Cette propriété est particulièrement utile lorsque vous souhaitez contr?ler l'alignement des instantanés de défilement. " > Quelle est la propriété de défilement de défilement de Scroll-margin-inline dans le sens CSS? Cette propriété est particulièrement utile lorsque vous souhaitez contr?ler l'alignement des instantanés de défilement. </a> </div> <div id="377j5v51b" class="Article_Details_main1L2s "> <a href="#Comment-puis-je-indiquer-la-position-de-défilement-sur-une-page-avec-CSS" title=" Comment puis-je indiquer la position de défilement sur une page avec CSS? " > Comment puis-je indiquer la position de défilement sur une page avec CSS? </a> </div> <div id="377j5v51b" class="Article_Details_main1L2s "> <a href="#Comment-puis-je-définir-la-position-de-défilement-par-défaut-à-l-aide-de-CSS" title=" Comment puis-je définir la position de défilement par défaut à l'aide de CSS? " > Comment puis-je définir la position de défilement par défaut à l'aide de CSS? </a> </div> <div id="377j5v51b" class="Article_Details_main1L2s "> <a href="#What-is-the-difference-between-scroll-behavior-smooth-and-scroll-behavior-auto-in-CSS" title="What is the difference between ‘scroll-behavior: smooth’ and ‘scroll-behavior: auto’ in CSS?" >What is the difference between ‘scroll-behavior: smooth’ and ‘scroll-behavior: auto’ in CSS?</a> </div> <div id="377j5v51b" class="Article_Details_main1L2s "> <a href="#Comment-puis-je-utiliser-JavaScript-pour-enregistrer-et-restaurer-la-position-de-défilement" title=" Comment puis-je utiliser JavaScript pour enregistrer et restaurer la position de défilement? " > Comment puis-je utiliser JavaScript pour enregistrer et restaurer la position de défilement? </a> </div> <div id="377j5v51b" class="Article_Details_main1L2s "> <a href="#Comment-puis-je-contr?ler-l-alignement-du-snapl-à-l-aide-de-CSS" title=" Comment puis-je contr?ler l'alignement du snapl à l'aide de CSS? " > Comment puis-je contr?ler l'alignement du snapl à l'aide de CSS? </a> </div> <div id="377j5v51b" class="Article_Details_main1L2s "> <a href="#Comment-puis-je-faire-en-sorte-qu-un-élément-colle-à-la-fenêtre-à-l-aide-de-CSS" title=" Comment puis-je faire en sorte qu'un élément colle à la fenêtre à l'aide de CSS? " > Comment puis-je faire en sorte qu'un élément colle à la fenêtre à l'aide de CSS? </a> </div> </div> </div> </div> <div id="377j5v51b" class="Article_Details_main1M"> <div id="377j5v51b" class="phpgenera_Details_mainL1"> <a href="http://www.miracleart.cn/fr/" title="Maison" class="phpgenera_Details_mainL1a">Maison</a> <img src="/static/imghw/top_right.png" alt="" /> <a href="http://www.miracleart.cn/fr/web-designer.html" class="phpgenera_Details_mainL1a">interface Web</a> <img src="/static/imghw/top_right.png" alt="" /> <a href="http://www.miracleart.cn/fr/js-tutorial.html" class="phpgenera_Details_mainL1a">js tutoriel</a> <img src="/static/imghw/top_right.png" alt="" /> <span>Plus de formulaires utilisables - Contr?le de la position de défilement</span> </div> <div id="377j5v51b" class="Articlelist_txts"> <div id="377j5v51b" class="Articlelist_txts_info"> <h1 class="Articlelist_txts_title">Plus de formulaires utilisables - Contr?le de la position de défilement</h1> <div id="377j5v51b" class="Articlelist_txts_info_head"> <div id="377j5v51b" class="author_info"> <a href="http://www.miracleart.cn/fr/member/1468494.html" class="author_avatar"> <img class="lazy" data-src="https://img.php.cn/upload/avatar/000/000/001/66ea812815a39919.png" src="/static/imghw/default1.png" alt="Jennifer Aniston"> </a> <div id="377j5v51b" class="author_detail"> <a href="http://www.miracleart.cn/fr/member/1468494.html" class="author_name">Jennifer Aniston</a> </div> </div> </div> <span id="377j5v51b" class="Articlelist_txts_time">Mar 06, 2025 am 12:32 AM</span> </div> </div> <hr /> <div id="377j5v51b" class="article_main php-article"> <div id="377j5v51b" 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/174119235980153.jpg" class="lazy" alt="More Usable Forms - Controlling Scroll Position "> </p> <p> <img src="" alt="Plus de formulaires utilisables - Contr?le de la position de défilement" > </p> <p> Je cherche constamment des moyens d'améliorer et d'affiner la convivialité de mes applications Web. En particulier, j'essaie toujours de trouver des moyens d'améliorer mes formulaires, car, avouons-le: si vous créez des applications Web, vous allez créer des formulaires. Très probablement, vous allez construire beaucoup de formulaires. </p> <p> Quiconque a observé un utilisateur moyen essayant de remplir un formulaire ou une série de formulaires sait que l'expérience est souvent frustrante. Prenez des mesures supplémentaires pour améliorer la convivialité de vos formulaires - même de manière mineure - ?- et vous pouvez vraiment stimuler la convivialité de votre application dans l'ensemble. </p> <p> Une technique que vous pouvez utiliser pour améliorer la convivialité de vos formulaires est de préserver le défilement de la page après les post-backs. Vous aimerez peut-être utiliser cette fonctionnalité dans une page de recherche, par exemple, sur laquelle l'utilisateur peut trier les résultats par colonne. Si vous avez en haut de la page A depuis qui accepte les paramètres de recherche et que vous affichez les résultats ci-dessous, il peut être très ennuyeux pour les utilisateurs de faire défiler la page après les paramètres des résultats chaque fois qu'ils souhaitent trier leurs résultats par une colonne donnée. Heureusement, nous pouvons faire quelque chose à ce sujet. </p> <h5 id="La-solution"> La solution </h5> <p> Dans ce didacticiel, je vais vous montrer avec quelle facilité de maintien de la position de défilement d'une page lorsque une page de formulaire remet en place à elle-même. Bien que j'aie codé l'exemple ici dans Coldfusion, la technique peut être facilement portée vers d'autres langues. </p> <p> Il n'y a vraiment que deux choses que vous devez faire pour faire fonctionner cette technique. Vous devrez écrire du javascript pour saisir les coordonnées actuelles X et Y de votre page et les mettre dans le formulaire afin qu'elles soient soumises lorsque vous publiez à la page actuelle. Ensuite, vous devrez prendre ces coordonnées X et Y de défilement et, via une combinaison de scripts c?té serveur et c?té client, définissez les coordonnées de défilement de la page une fois qu'elle recharge. Morceau de gateau! </p> <h5 id="le-code-de-formulaire"> le code de formulaire </h5> <p> J'utilise un formulaire à nu ici afin que vous puissiez vraiment vous concentrer clairement sur la mécanique du fonctionnement du processus, plut?t que la création d'une page de recherche plus compliquée du type que je mentionne ci-dessus. Une fois que vous savez comment faire fonctionner les choses, vous pouvez facilement adapter cet exemple à vos propres besoins et être aussi intelligent que vous le souhaitez. </p> <pre class="brush:php;toolbar:false"><cfparam name="FORM.name" default="Testing"> <br> <br> <html> <br> <head> <br> ? <title>Test</title> <br> </head> <br> <body> <br> <br> <form name="Form1" ?<br> ? method="POST" ?<br> ? action="<cfoutput>#CGI.SCRIPT_NAME#</cfoutput>"> <br> <br> ? <p>1</p> <p>2</p> <p>3</p> <p>4</p> <p>5</p> ?<br> ? <p>6</p> <p>7</p> <p>8</p> <p>9</p> <p>10</p> <br> <br> ? <hr width="2000"> <br> <br> ? <nobr> <br> ? Name: <input type="text" name="name" value="<cfoutput>#FORM.name#</cfoutput>"> <br> ? <input type="submit" value="Submit"></nobr> <br> <br> ? <hr width="2000"> <br> ? ?<br> ? <p>11</p> <p>12</p> <p>13</p> <p>14</p> <p>15</p> ?<br> ? <p>16</p> <p>17</p> <p>18</p> <p>19</p> <p>20</p> <br> <br> </form> <br> <br> </body> <br> </html></pre> <p> Cette page de formulaire ne fait rien de spécial pour le moment. Il repose simplement vers lui-même, passant le paramètre de nom. J'ai codé les paragraphes et les nombres afin que nous ayons du contenu défilent sur la page, et que nous ayons un guide visuel pour aider à juger jusqu'où la page s'est déroulée verticalement (notez que ce script préservera le défilement vertical et horizontal, cependant). </p> <h5 id="Trouver-le-parchemin"> Trouver le parchemin </h5> <p> La première étape consiste à ajouter du javascript pour obtenir les valeurs X et Y de défilement et les mettre dans le formulaire. Pour ce faire, nous devrons ajouter deux entrées cachées à notre formulaire ainsi que quelques lignes de JavaScript qui saisiront les valeurs de défilement actuelles lorsque le formulaire est soumis et les transmettra aux entrées cachées. La fonction SaveScrollCoOrdineats () examinera la prise en charge du navigateur pour le document. tout et utiliseront les références correctes pour saisir les valeurs de défilement et mettre à jour les entrées de formulaire en conséquence. Nous utiliserons le gestionnaire d'événements onSubmit () sous notre forme pour l'appeler dans cet exemple. </p> <p> J'ai codé les champs cachés qui stockent les valeurs de défilement en tant que champs de texte dans cet exemple, donc si vous avez des yeux rapides, vous pouvez regarder comment les valeurs changent avant la soumission du formulaire. </p> <pre class="brush:php;toolbar:false"><cfparam name="FORM.name" default="Testing"> <br> <br> <html> <br> <head> <br> ? <title>Test</title> <br> </head> <br> <body> <br> <br> <form name="Form1" ?<br> ? method="POST" ?<br> ? action="<cfoutput>#CGI.SCRIPT_NAME#</cfoutput>"> <br> <br> ? <p>1</p> <p>2</p> <p>3</p> <p>4</p> <p>5</p> ?<br> ? <p>6</p> <p>7</p> <p>8</p> <p>9</p> <p>10</p> <br> <br> ? <hr width="2000"> <br> <br> ? <nobr> <br> ? Name: <input type="text" name="name" value="<cfoutput>#FORM.name#</cfoutput>"> <br> ? <input type="submit" value="Submit"></nobr> <br> <br> ? <hr width="2000"> <br> ? ?<br> ? <p>11</p> <p>12</p> <p>13</p> <p>14</p> <p>15</p> ?<br> ? <p>16</p> <p>17</p> <p>18</p> <p>19</p> <p>20</p> <br> <br> </form> <br> <br> </body> <br> </html></pre> <p> La deuxième étape consiste à prendre les valeurs qui sont passées avec la forme et à faire quelque chose avec elles. Pour cela, nous devrons ajouter quelques lignes de JavaScript avec juste une touche de Coldfusion. Tout d'abord, nous insérerons deux balises CFPARAM supplémentaires en haut de la page afin que nous ayons des valeurs de défilement par défaut avec lesquelles travailler sur chaque page de page. Ensuite, nous définirons la fonction ScrollToCoOrdineats () pour définir le défilement de la page et l'appeler lorsque la page se charge à l'aide du gestionnaire d'événements Onload () dans la balise </p>. <pre class="brush:php;toolbar:false"><cfparam name="FORM.name" default="Testing"> <br> <br> <html> <br> <head> <br> ? <title>Test</title> <br> <script language=javascript> <br> function saveScrollCoordinates() { <br> ? document.Form1.scrollx.value = (document.all)?document.body.scrollLeft:window.pageXOffset; <br> ? document.Form1.scrolly.value = (document.all)?document.body.scrollTop:window.pageYOffset; <br> } <br> </script> <br> </head> <br> <body> <br> <br> <form name="Form1" ?<br> ? method="POST" ?<br> ? onSubmit="saveScrollCoordinates()" ?<br> ? action="<cfoutput>#CGI.SCRIPT_NAME#</cfoutput>"> <br> <br> ? <p>1</p> <p>2</p> <p>3</p> <p>4</p> <p>5</p> ?<br> ? <p>6</p> <p>7</p> <p>8</p> <p>9</p> <p>10</p> <br> <br> ? <hr width="2000"> <br> <br> ? <nobr> <br> ? Name: <input type="text" name="name" value="<cfoutput>#FORM.name#</cfoutput>"> <br> <input type="text" name="scrollx" value="0"> <br> ? <input type="text" name="scrolly" value="0"> <br> ? <input type="submit" value="Submit"></nobr> <br> <br> ? <hr width="2000"> <br> ? ?<br> ? <p>11</p> <p>12</p> <p>13</p> <p>14</p> <p>15</p> ?<br> ? <p>16</p> <p>17</p> <p>18</p> <p>19</p> <p>20</p> <br> <br> </form> <br> <br> </body> <br> </html></pre> <p> Voici la ventilation play-by-play qui décrit ce qui se passe lorsque l'utilisateur clique sur le bouton pour soumettre le formulaire: </p> <p> </p> <ol> <li> La fonction SaveScrollCoOrdineats () est exécutée par le gestionnaire d'événements OnSubmit () du formulaire. </li> <br> <li> SAVESCROLLCOORDINATES () met à jour les entrées Scrollx et Scrolly cachées avec les valeurs appropriées. </li> <br> <li> Le formulaire remet la même page. </li> <br> <li> Les paramètres de forme Coldfusion Scrollxx et définissent grol les coordonnées de défilement dans la fonction ScrollToCoOrdinetes (). </li> <br> <li> Le gestionnaire d'événements Onload () dans la balise appelle la fonction ScrollToCoOrdinetes (). </li> <br> <li> Les propriétés de défilement de la fenêtre sont ajustées en fonction des coordonnées passées. </li> </ol> <p> </p> <p> Testez le formulaire et vous remarquerez que peu importe où vous faites défiler, lorsque vous soumettez la page, vous vous retrouvez au même endroit où vous avez commencé à la fois verticalement et horizontalement. Pour mieux tester le parchemin horizontal, redimensionnez votre navigateur afin qu'il soit très étroit, puis soumettez le formulaire. Vos rouleaux X et Y sont conservés automatiquement un autre moyen de réaliser cela utilise des ancres HREF, mais cela n'est pas aussi précis ou lisse. </p> <h5 id="Envelopper"> Envelopper </h5> <p> Qu'en est-il de l'exemple que j'ai donné ci-dessus, où nous avions une page de recherche contenant un formulaire d'entrée et des résultats qui pourraient être triés par colonne? Dans ce cas, vous êtes susceptible de soumettre le formulaire et d'exécuter un peu de SQL avec des valeurs légèrement différentes chaque fois que l'utilisateur choisit de cliquer sur une colonne en tête pour trier. Si vous mettez à jour des entrées masquées avec la nouvelle colonne de tri et la direction de tri, il devrait être une tache facile d'ajouter cette fonctionnalité à votre page. Vous n'avez qu'à insérer les entrées cachées supplémentaires dans votre formulaire et à incorporer le JavaScript présenté ici dans votre propre JavaScript. Vos liens de tri peuvent utiliser le gestionnaire d'événements onClick () pour mettre à jour les valeurs de défilement cachées et soumettre à nouveau votre formulaire. </p> <p> Ce que je vous ai montré est juste un exemple simple de cette technique. Le code ici a été testé à l'aide d'Internet Explorer 6 et de Mozilla Firefox pour Windows et Safari sur un Mac. Utilisez l'idée derrière cette technique comme point de départ. Appliquez votre propre créativité et vos compétences pour ajouter une sensation plus polie et intuitive aux formulaires que vous utilisez dans vos applications. </p> <h2 id="Questions-fréquemment-posées-sur-la-préservation-de-la-position-de-défilement-de-la-page"> Questions fréquemment posées sur la préservation de la position de défilement de la page </h2> <h3 id="Comment-puis-je-préserver-la-position-de-défilement-d-une-page-à-l-aide-de-CSS"> Comment puis-je préserver la position de défilement d'une page à l'aide de CSS? </h3> <p> La préservation de la position de défilement d'une page à l'aide de CSS peut être obtenue en utilisant la propriété ?Scroll-Behavior?. Cette propriété spécifie si le défilement doit être lisse ou sauté. Pour rendre la position de défilement lisse, vous pouvez utiliser ?Scroll-Behavior: Smooth?. Cela rendra la transition d'une partie de la page à une autre plus fluide, préservant ainsi la position de défilement. </p> <h3 id="Quel-est-le-r?le-de-JavaScript-dans-la-préservation-de-la-position-de-défilement"> Quel est le r?le de JavaScript dans la préservation de la position de défilement? </h3> <p> JavaScript joue un r?le crucial dans la préservation de la position de défilement d'une page. Il vous permet d'enregistrer la position de défilement dans une variable, puis de l'utiliser plus tard pour restaurer la position. Ceci est particulièrement utile lorsque vous souhaitez maintenir la position de défilement après un rafra?chissement de page ou lorsque vous retournez vers une page. </p> <h3 id="Comment-puis-je-modifier-la-position-de-la-barre-de-défilement-à-l-aide-de-CSS"> Comment puis-je modifier la position de la barre de défilement à l'aide de CSS? </h3> <p> La position de la barre de défilement peut être modifiée à l'aide de CSS en utilisant la propriété ?Direction?. Cette propriété détermine la direction du texte et où la barre de défilement doit être placée. Par exemple, si vous voulez que la barre de défilement soit à gauche, vous pouvez utiliser ?Direction: RTL?, et pour la droite, vous pouvez utiliser ?Direction: LTR?. </p> <h3 id="Quelle-est-la-propriété-de-défilement-de-défilement-de-Scroll-margin-inline-dans-le-sens-CSS-Cette-propriété-est-particulièrement-utile-lorsque-vous-souhaitez-contr?ler-l-alignement-des-instantanés-de-défilement"> Quelle est la propriété de défilement de défilement de Scroll-margin-inline dans le sens CSS? Cette propriété est particulièrement utile lorsque vous souhaitez contr?ler l'alignement des instantanés de défilement. </h3> <h3 id="Comment-puis-je-indiquer-la-position-de-défilement-sur-une-page-avec-CSS"> Comment puis-je indiquer la position de défilement sur une page avec CSS? </h3> <p> indiquant que la position de défilement sur une page avec CSS peut être réalisée en utilisant la propriété ?position?. Cette propriété vous permet de positionner un élément par rapport à la fenêtre, qui peut être utilisée pour indiquer la position de défilement. Par exemple, vous pouvez utiliser ?Position: Sticky? pour faire respecter un élément à la fenêtre, indiquant ainsi la position de défilement. </p> <h3 id="Comment-puis-je-définir-la-position-de-défilement-par-défaut-à-l-aide-de-CSS"> Comment puis-je définir la position de défilement par défaut à l'aide de CSS? </h3> <p> Définition de la position de défilement par défaut à l'aide de CSS peut être réalisée en utilisant les propriétés ?scroll-Behavior? et ?Scroll-Snap-Type?. These properties allow you to control the scroll position and make it snap to certain points.</p> <h3 id="What-is-the-difference-between-scroll-behavior-smooth-and-scroll-behavior-auto-in-CSS">What is the difference between ‘scroll-behavior: smooth’ and ‘scroll-behavior: auto’ in CSS?</h3> <p>The ‘scroll-behavior: smooth’ property in CSS makes the scrolling smooth, while the ‘scroll-behavior: auto’ property makes the scrolling jump to the target emplacement. La propriété ?lisse? est utile lorsque vous souhaitez faire la transition d'une partie de la page à une autre plus fluide, tandis que la propriété ?Auto? est utile lorsque vous souhaitez sauter à un emplacement spécifique. </p> <h3 id="Comment-puis-je-utiliser-JavaScript-pour-enregistrer-et-restaurer-la-position-de-défilement"> Comment puis-je utiliser JavaScript pour enregistrer et restaurer la position de défilement? </h3> <p> Vous pouvez utiliser la propriété ?Fenêtre? dans Javascript pour sauver la position Scroll dans une variable. Ensuite, vous pouvez utiliser la méthode ?Window.scrollto? pour restaurer la position de défilement. Ceci est particulièrement utile lorsque vous souhaitez maintenir la position de défilement après un rafra?chissement de page ou lorsque vous retournez vers une page. </p> <h3 id="Comment-puis-je-contr?ler-l-alignement-du-snapl-à-l-aide-de-CSS"> Comment puis-je contr?ler l'alignement du snapl à l'aide de CSS? </h3> <p> L'alignement instantané de défilement peut être contr?lé à l'aide de la propriété "Scroll-Snap-Align" dans CSS. Cette propriété spécifie où un élément doit s'aligner lorsqu'un instantané de défilement se produit. Par exemple, vous pouvez utiliser ?Scroll-Snap-Align: Start? pour aligner l'élément au début du conteneur. </p> <h3 id="Comment-puis-je-faire-en-sorte-qu-un-élément-colle-à-la-fenêtre-à-l-aide-de-CSS"> Comment puis-je faire en sorte qu'un élément colle à la fenêtre à l'aide de CSS? </h3> <p> Faire un élément à la Viewport peut être réalisé en utilisant la propriété ?Position: Sticky? dans CSS. Cette propriété positionne un élément basé sur la position de défilement de l'utilisateur. Par exemple, vous pouvez utiliser la position ?Sticky; En haut: 0 ’pour faire en sorte qu'un élément colle en haut de la fenêtre. </p><p>Ce qui précède est le contenu détaillé de. pour plus d'informations, suivez d'autres articles connexes sur le site Web de PHP en chinois!</p> </div> </div> <div id="377j5v51b" class="wzconShengming_sp"> <div id="377j5v51b" class="bzsmdiv_sp">Déclaration de ce site Web</div> <div>Le contenu de cet article est volontairement contribué par les internautes et les droits d'auteur appartiennent à l'auteur original. Ce site n'assume aucune responsabilité légale correspondante. Si vous trouvez un contenu suspecté de plagiat ou de contrefa?on, veuillez contacter 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="377j5v51b" 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="377j5v51b" class="phpgenera_Details_mainR4"> <div id="377j5v51b" class="phpmain1_4R_readrank"> <div id="377j5v51b" 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>Article chaud</h2> </div> <div id="377j5v51b" class="phpgenera_Details_mainR4_bottom"> <div id="377j5v51b" class="phpgenera_Details_mainR4_bottoms"> <a href="http://www.miracleart.cn/fr/faq/1796832397.html" title="Guide de construction de Grass Wonder | Uma musume joli derby" class="phpgenera_Details_mainR4_bottom_title">Guide de construction de Grass Wonder | Uma musume joli derby</a> <div id="377j5v51b" class="phpgenera_Details_mainR4_bottoms_info"> <span>1 Il y a quelques mois</span> <span>By Jack chen</span> </div> </div> <div id="377j5v51b" class="phpgenera_Details_mainR4_bottoms"> <a href="http://www.miracleart.cn/fr/faq/1796833110.html" title="<??>: 99 nuits dans la forêt - tous les badges et comment les déverrouiller" class="phpgenera_Details_mainR4_bottom_title"><??>: 99 nuits dans la forêt - tous les badges et comment les déverrouiller</a> <div id="377j5v51b" class="phpgenera_Details_mainR4_bottoms_info"> <span>4 Il y a quelques semaines</span> <span>By DDD</span> </div> </div> <div id="377j5v51b" class="phpgenera_Details_mainR4_bottoms"> <a href="http://www.miracleart.cn/fr/faq/1796831605.html" title="Uma Musume Pretty Derby Banner Schedule (juillet 2025)" class="phpgenera_Details_mainR4_bottom_title">Uma Musume Pretty Derby Banner Schedule (juillet 2025)</a> <div id="377j5v51b" class="phpgenera_Details_mainR4_bottoms_info"> <span>1 Il y a quelques mois</span> <span>By Jack chen</span> </div> </div> <div id="377j5v51b" class="phpgenera_Details_mainR4_bottoms"> <a href="http://www.miracleart.cn/fr/faq/1796836699.html" title="Guide de température de Rimworld Odyssey pour les navires et Gravtech" class="phpgenera_Details_mainR4_bottom_title">Guide de température de Rimworld Odyssey pour les navires et Gravtech</a> <div id="377j5v51b" class="phpgenera_Details_mainR4_bottoms_info"> <span>3 Il y a quelques semaines</span> <span>By Jack chen</span> </div> </div> <div id="377j5v51b" class="phpgenera_Details_mainR4_bottoms"> <a href="http://www.miracleart.cn/fr/faq/1796831905.html" title="Windows Security est vide ou ne montre pas les options" class="phpgenera_Details_mainR4_bottom_title">Windows Security est vide ou ne montre pas les options</a> <div id="377j5v51b" class="phpgenera_Details_mainR4_bottoms_info"> <span>1 Il y a quelques mois</span> <span>By 下次還敢</span> </div> </div> </div> <div id="377j5v51b" class="phpgenera_Details_mainR3_more"> <a href="http://www.miracleart.cn/fr/article.html">Afficher plus</a> </div> </div> </div> --> <div id="377j5v51b" class="phpgenera_Details_mainR3"> <div id="377j5v51b" class="phpmain1_4R_readrank"> <div id="377j5v51b" 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>Outils d'IA chauds</h2> </div> <div id="377j5v51b" class="phpgenera_Details_mainR3_bottom"> <div id="377j5v51b" class="phpmain_tab2_mids_top"> <a href="http://www.miracleart.cn/fr/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="377j5v51b" class="phpmain_tab2_mids_info"> <a href="http://www.miracleart.cn/fr/ai/undress-ai-tool" title="Undress AI Tool" class="phpmain_tab2_mids_title"> <h3>Undress AI Tool</h3> </a> <p>Images de déshabillage gratuites</p> </div> </div> <div id="377j5v51b" class="phpmain_tab2_mids_top"> <a href="http://www.miracleart.cn/fr/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="377j5v51b" class="phpmain_tab2_mids_info"> <a href="http://www.miracleart.cn/fr/ai/undresserai-undress" title="Undresser.AI Undress" class="phpmain_tab2_mids_title"> <h3>Undresser.AI Undress</h3> </a> <p>Application basée sur l'IA pour créer des photos de nu réalistes</p> </div> </div> <div id="377j5v51b" class="phpmain_tab2_mids_top"> <a href="http://www.miracleart.cn/fr/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="377j5v51b" class="phpmain_tab2_mids_info"> <a href="http://www.miracleart.cn/fr/ai/ai-clothes-remover" title="AI Clothes Remover" class="phpmain_tab2_mids_title"> <h3>AI Clothes Remover</h3> </a> <p>Outil d'IA en ligne pour supprimer les vêtements des photos.</p> </div> </div> <div id="377j5v51b" class="phpmain_tab2_mids_top"> <a href="http://www.miracleart.cn/fr/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="377j5v51b" class="phpmain_tab2_mids_info"> <a href="http://www.miracleart.cn/fr/ai/clothoffio" title="Clothoff.io" class="phpmain_tab2_mids_title"> <h3>Clothoff.io</h3> </a> <p>Dissolvant de vêtements AI</p> </div> </div> <div id="377j5v51b" class="phpmain_tab2_mids_top"> <a href="http://www.miracleart.cn/fr/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="377j5v51b" class="phpmain_tab2_mids_info"> <a href="http://www.miracleart.cn/fr/ai/video-swap" title="Video Face Swap" class="phpmain_tab2_mids_title"> <h3>Video Face Swap</h3> </a> <p>échangez les visages dans n'importe quelle vidéo sans effort grace à notre outil d'échange de visage AI entièrement gratuit?!</p> </div> </div> </div> <div id="377j5v51b" class="phpgenera_Details_mainR3_more"> <a href="http://www.miracleart.cn/fr/ai">Afficher plus</a> </div> </div> </div> <div id="377j5v51b" class="phpgenera_Details_mainR4"> <div id="377j5v51b" class="phpmain1_4R_readrank"> <div id="377j5v51b" 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>Article chaud</h2> </div> <div id="377j5v51b" class="phpgenera_Details_mainR4_bottom"> <div id="377j5v51b" class="phpgenera_Details_mainR4_bottoms"> <a href="http://www.miracleart.cn/fr/faq/1796832397.html" title="Guide de construction de Grass Wonder | Uma musume joli derby" class="phpgenera_Details_mainR4_bottom_title">Guide de construction de Grass Wonder | Uma musume joli derby</a> <div id="377j5v51b" class="phpgenera_Details_mainR4_bottoms_info"> <span>1 Il y a quelques mois</span> <span>By Jack chen</span> </div> </div> <div id="377j5v51b" class="phpgenera_Details_mainR4_bottoms"> <a href="http://www.miracleart.cn/fr/faq/1796833110.html" title="<??>: 99 nuits dans la forêt - tous les badges et comment les déverrouiller" class="phpgenera_Details_mainR4_bottom_title"><??>: 99 nuits dans la forêt - tous les badges et comment les déverrouiller</a> <div id="377j5v51b" class="phpgenera_Details_mainR4_bottoms_info"> <span>4 Il y a quelques semaines</span> <span>By DDD</span> </div> </div> <div id="377j5v51b" class="phpgenera_Details_mainR4_bottoms"> <a href="http://www.miracleart.cn/fr/faq/1796831605.html" title="Uma Musume Pretty Derby Banner Schedule (juillet 2025)" class="phpgenera_Details_mainR4_bottom_title">Uma Musume Pretty Derby Banner Schedule (juillet 2025)</a> <div id="377j5v51b" class="phpgenera_Details_mainR4_bottoms_info"> <span>1 Il y a quelques mois</span> <span>By Jack chen</span> </div> </div> <div id="377j5v51b" class="phpgenera_Details_mainR4_bottoms"> <a href="http://www.miracleart.cn/fr/faq/1796836699.html" title="Guide de température de Rimworld Odyssey pour les navires et Gravtech" class="phpgenera_Details_mainR4_bottom_title">Guide de température de Rimworld Odyssey pour les navires et Gravtech</a> <div id="377j5v51b" class="phpgenera_Details_mainR4_bottoms_info"> <span>3 Il y a quelques semaines</span> <span>By Jack chen</span> </div> </div> <div id="377j5v51b" class="phpgenera_Details_mainR4_bottoms"> <a href="http://www.miracleart.cn/fr/faq/1796831905.html" title="Windows Security est vide ou ne montre pas les options" class="phpgenera_Details_mainR4_bottom_title">Windows Security est vide ou ne montre pas les options</a> <div id="377j5v51b" class="phpgenera_Details_mainR4_bottoms_info"> <span>1 Il y a quelques mois</span> <span>By 下次還敢</span> </div> </div> </div> <div id="377j5v51b" class="phpgenera_Details_mainR3_more"> <a href="http://www.miracleart.cn/fr/article.html">Afficher plus</a> </div> </div> </div> <div id="377j5v51b" class="phpgenera_Details_mainR3"> <div id="377j5v51b" class="phpmain1_4R_readrank"> <div id="377j5v51b" 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>Outils chauds</h2> </div> <div id="377j5v51b" class="phpgenera_Details_mainR3_bottom"> <div id="377j5v51b" class="phpmain_tab2_mids_top"> <a href="http://www.miracleart.cn/fr/toolset/development-tools/92" title="Bloc-notes++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="Bloc-notes++7.3.1" /> </a> <div id="377j5v51b" class="phpmain_tab2_mids_info"> <a href="http://www.miracleart.cn/fr/toolset/development-tools/92" title="Bloc-notes++7.3.1" class="phpmain_tab2_mids_title"> <h3>Bloc-notes++7.3.1</h3> </a> <p>éditeur de code facile à utiliser et gratuit</p> </div> </div> <div id="377j5v51b" class="phpmain_tab2_mids_top"> <a href="http://www.miracleart.cn/fr/toolset/development-tools/93" title="SublimeText3 version chinoise" 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 version chinoise" /> </a> <div id="377j5v51b" class="phpmain_tab2_mids_info"> <a href="http://www.miracleart.cn/fr/toolset/development-tools/93" title="SublimeText3 version chinoise" class="phpmain_tab2_mids_title"> <h3>SublimeText3 version chinoise</h3> </a> <p>Version chinoise, très simple à utiliser</p> </div> </div> <div id="377j5v51b" class="phpmain_tab2_mids_top"> <a href="http://www.miracleart.cn/fr/toolset/development-tools/121" title="Envoyer 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="Envoyer Studio 13.0.1" /> </a> <div id="377j5v51b" class="phpmain_tab2_mids_info"> <a href="http://www.miracleart.cn/fr/toolset/development-tools/121" title="Envoyer Studio 13.0.1" class="phpmain_tab2_mids_title"> <h3>Envoyer Studio 13.0.1</h3> </a> <p>Puissant environnement de développement intégré PHP</p> </div> </div> <div id="377j5v51b" class="phpmain_tab2_mids_top"> <a href="http://www.miracleart.cn/fr/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="377j5v51b" class="phpmain_tab2_mids_info"> <a href="http://www.miracleart.cn/fr/toolset/development-tools/469" title="Dreamweaver CS6" class="phpmain_tab2_mids_title"> <h3>Dreamweaver CS6</h3> </a> <p>Outils de développement Web visuel</p> </div> </div> <div id="377j5v51b" class="phpmain_tab2_mids_top"> <a href="http://www.miracleart.cn/fr/toolset/development-tools/500" title="SublimeText3 version 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 version Mac" /> </a> <div id="377j5v51b" class="phpmain_tab2_mids_info"> <a href="http://www.miracleart.cn/fr/toolset/development-tools/500" title="SublimeText3 version Mac" class="phpmain_tab2_mids_title"> <h3>SublimeText3 version Mac</h3> </a> <p>Logiciel d'édition de code au niveau de Dieu (SublimeText3)</p> </div> </div> </div> <div id="377j5v51b" class="phpgenera_Details_mainR3_more"> <a href="http://www.miracleart.cn/fr/ai">Afficher plus</a> </div> </div> </div> <div id="377j5v51b" class="phpgenera_Details_mainR4"> <div id="377j5v51b" class="phpmain1_4R_readrank"> <div id="377j5v51b" 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>Sujets chauds</h2> </div> <div id="377j5v51b" class="phpgenera_Details_mainR4_bottom"> <div id="377j5v51b" class="phpgenera_Details_mainR4_bottoms"> <a href="http://www.miracleart.cn/fr/faq/laravel-tutori" title="Tutoriel Laravel" class="phpgenera_Details_mainR4_bottom_title">Tutoriel Laravel</a> <div id="377j5v51b" class="phpgenera_Details_mainR4_bottoms_info"> <div id="377j5v51b" class="phpgenera_Details_mainR4_bottoms_infos"> <img src="/static/imghw/eyess.png" alt="" /> <span>1601</span> </div> <div id="377j5v51b" class="phpgenera_Details_mainR4_bottoms_infos"> <img src="/static/imghw/tiezi.png" alt="" /> <span>29</span> </div> </div> </div> <div id="377j5v51b" class="phpgenera_Details_mainR4_bottoms"> <a href="http://www.miracleart.cn/fr/faq/php-tutorial" title="Tutoriel PHP" class="phpgenera_Details_mainR4_bottom_title">Tutoriel PHP</a> <div id="377j5v51b" class="phpgenera_Details_mainR4_bottoms_info"> <div id="377j5v51b" class="phpgenera_Details_mainR4_bottoms_infos"> <img src="/static/imghw/eyess.png" alt="" /> <span>1502</span> </div> <div id="377j5v51b" class="phpgenera_Details_mainR4_bottoms_infos"> <img src="/static/imghw/tiezi.png" alt="" /> <span>276</span> </div> </div> </div> </div> <div id="377j5v51b" class="phpgenera_Details_mainR3_more"> <a href="http://www.miracleart.cn/fr/faq/zt">Afficher plus</a> </div> </div> </div> </div> </div> <div id="377j5v51b" class="Article_Details_main2"> <div id="377j5v51b" class="phpgenera_Details_mainL4"> <div id="377j5v51b" 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="377j5v51b" class="phpgenera_Details_mainL4_info"> <div id="377j5v51b" class="phphistorical_Version2_mids"> <a href="http://www.miracleart.cn/fr/faq/1796836217.html" title="Comment faire une demande HTTP dans 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="Comment faire une demande HTTP dans Node.js?" /> </a> <a href="http://www.miracleart.cn/fr/faq/1796836217.html" title="Comment faire une demande HTTP dans Node.js?" class="phphistorical_Version2_mids_title">Comment faire une demande HTTP dans Node.js?</a> <span id="377j5v51b" class="Articlelist_txts_time">Jul 13, 2025 am 02:18 AM</span> <p class="Articlelist_txts_p">Il existe trois fa?ons courantes d'initier des demandes HTTP dans Node.js: utilisez des modules intégrés, Axios et Node-Fetch. 1. Utilisez le module HTTP / HTTPS intégré sans dépendances, ce qui convient aux scénarios de base, mais nécessite un traitement manuel de la couture des données et de la surveillance des erreurs, tels que l'utilisation de https.get () pour obtenir des données ou envoyer des demandes de post via .write (); 2.AXIOS est une bibliothèque tierce basée sur la promesse. Il a une syntaxe concise et des fonctions puissantes, prend en charge l'async / attendre, la conversion JSON automatique, l'intercepteur, etc. Il est recommandé de simplifier les opérations de demande asynchrones; 3.Node-Fetch fournit un style similaire à la récupération du navigateur, basé sur la promesse et la syntaxe simple</p> </div> <div id="377j5v51b" class="phphistorical_Version2_mids"> <a href="http://www.miracleart.cn/fr/faq/1796836292.html" title="Types de données JavaScript: référence primitive 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="Types de données JavaScript: référence primitive vs" /> </a> <a href="http://www.miracleart.cn/fr/faq/1796836292.html" title="Types de données JavaScript: référence primitive vs" class="phphistorical_Version2_mids_title">Types de données JavaScript: référence primitive vs</a> <span id="377j5v51b" class="Articlelist_txts_time">Jul 13, 2025 am 02:43 AM</span> <p class="Articlelist_txts_p">Les types de données JavaScript sont divisés en types primitifs et types de référence. Les types primitifs incluent la cha?ne, le nombre, le booléen, le nul, un non défini et le symbole. Les valeurs sont immuables et les copies sont copiées lors de l'attribution des valeurs, de sorte qu'elles ne se affectent pas; Les types de référence tels que les objets, les tableaux et les fonctions stockent les adresses de mémoire, et les variables pointant vers le même objet s'afferchent mutuellement. Le typeof et l'instance de OFF peuvent être utilisés pour déterminer les types, mais prêtent attention aux problèmes historiques de typeofnull. Comprendre ces deux types de différences peut aider à écrire un code plus stable et fiable.</p> </div> <div id="377j5v51b" class="phphistorical_Version2_mids"> <a href="http://www.miracleart.cn/fr/faq/1796832745.html" title="Objet JavaScript Time, quelqu'un construit un site Web Eactexe, plus rapide sur Google Chrome, etc." 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="Objet JavaScript Time, quelqu'un construit un site Web Eactexe, plus rapide sur Google Chrome, etc." /> </a> <a href="http://www.miracleart.cn/fr/faq/1796832745.html" title="Objet JavaScript Time, quelqu'un construit un site Web Eactexe, plus rapide sur Google Chrome, etc." class="phphistorical_Version2_mids_title">Objet JavaScript Time, quelqu'un construit un site Web Eactexe, plus rapide sur Google Chrome, etc.</a> <span id="377j5v51b" class="Articlelist_txts_time">Jul 08, 2025 pm 02:27 PM</span> <p class="Articlelist_txts_p">Bonjour, développeurs JavaScript! Bienvenue dans JavaScript News de cette semaine! Cette semaine, nous nous concentrerons sur: le différend de marque d'Oracle avec Deno, les nouveaux objets Time JavaScript sont pris en charge par les navigateurs, les mises à jour Google Chrome et certains outils de développeurs puissants. Commen?ons! Le différend de marque d'Oracle avec la tentative de Deno Oracle d'enregistrer une marque "JavaScript" a provoqué la controverse. Ryan Dahl, le créateur de Node.js et Deno, a déposé une pétition pour annuler la marque, et il pense que JavaScript est un niveau ouvert et ne devrait pas être utilisé par Oracle</p> </div> <div id="377j5v51b" class="phphistorical_Version2_mids"> <a href="http://www.miracleart.cn/fr/faq/1796832608.html" title="Gestion des promesses: cha?nage, gestion des erreurs et combinateurs de promesses en 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="Gestion des promesses: cha?nage, gestion des erreurs et combinateurs de promesses en javascript" /> </a> <a href="http://www.miracleart.cn/fr/faq/1796832608.html" title="Gestion des promesses: cha?nage, gestion des erreurs et combinateurs de promesses en javascript" class="phphistorical_Version2_mids_title">Gestion des promesses: cha?nage, gestion des erreurs et combinateurs de promesses en javascript</a> <span id="377j5v51b" class="Articlelist_txts_time">Jul 08, 2025 am 02:40 AM</span> <p class="Articlelist_txts_p">La promesse est le mécanisme central pour gérer les opérations asynchrones en JavaScript. Comprendre les appels de cha?ne, la gestion des erreurs et les combinants est la clé pour ma?triser leurs applications. 1. L'appel de la cha?ne renvoie une nouvelle promesse à travers. Puis () pour réaliser la concaténation des processus asynchrones. Chaque .then () re?oit le résultat précédent et peut renvoyer une valeur ou une promesse; 2. La gestion des erreurs doit utiliser .catch () pour attraper des exceptions pour éviter les défaillances silencieuses, et peut renvoyer la valeur par défaut dans Catch pour continuer le processus; 3. Combinateurs tels que promesse.all () (réussi avec succès uniquement après tout succès), promesse.race () (le premier achèvement est retourné) et promesse.allsetTled () (en attente de toutes les achèvements)</p> </div> <div id="377j5v51b" class="phphistorical_Version2_mids"> <a href="http://www.miracleart.cn/fr/faq/1796832618.html" title="Qu'est-ce que l'API Cache et comment est-elle utilisée avec les travailleurs du service?" 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="Qu'est-ce que l'API Cache et comment est-elle utilisée avec les travailleurs du service?" /> </a> <a href="http://www.miracleart.cn/fr/faq/1796832618.html" title="Qu'est-ce que l'API Cache et comment est-elle utilisée avec les travailleurs du service?" class="phphistorical_Version2_mids_title">Qu'est-ce que l'API Cache et comment est-elle utilisée avec les travailleurs du service?</a> <span id="377j5v51b" class="Articlelist_txts_time">Jul 08, 2025 am 02:43 AM</span> <p class="Articlelist_txts_p">Cacheapi est un outil fourni par le navigateur pour mettre en cache les demandes de réseau, qui est souvent utilisée en conjonction avec travailleur de service pour améliorer les performances du site Web et l'expérience hors ligne. 1. Il permet aux développeurs de stocker manuellement des ressources telles que des scripts, des feuilles de style, des photos, etc.; 2. Il peut faire correspondre les réponses du cache en fonction des demandes; 3. Il prend en charge la suppression des caches spécifiques ou la nettoyage du cache entier; 4. Il peut mettre en ?uvre des stratégies de priorité de cache ou de priorité de réseau grace à l'écoute des événements Fetch; 5. Il est souvent utilisé pour le support hors ligne, accélérez la vitesse d'accès répétée, préchargement des ressources clés et du contenu de mise à jour des antécédents; 6. Lorsque vous l'utilisez, vous devez faire attention au contr?le de la version du cache, aux restrictions de stockage et à la différence entre le mécanisme de mise en cache HTTP.</p> </div> <div id="377j5v51b" class="phphistorical_Version2_mids"> <a href="http://www.miracleart.cn/fr/faq/1796832563.html" title="JS Roundup: une plongée profonde dans la boucle d'événement 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/431/639/175191266081499.jpg?x-oss-process=image/resize,m_fill,h_207,w_330" alt="JS Roundup: une plongée profonde dans la boucle d'événement JavaScript" /> </a> <a href="http://www.miracleart.cn/fr/faq/1796832563.html" title="JS Roundup: une plongée profonde dans la boucle d'événement JavaScript" class="phphistorical_Version2_mids_title">JS Roundup: une plongée profonde dans la boucle d'événement JavaScript</a> <span id="377j5v51b" class="Articlelist_txts_time">Jul 08, 2025 am 02:24 AM</span> <p class="Articlelist_txts_p">La boucle d'événement de JavaScript gère les opérations asynchrones en coordonnant les piles d'appels, les webapis et les files d'attente de taches. 1. La pile d'appels exécute du code synchrone, et lors de la rencontre de taches asynchrones, il est remis à WebAPI pour le traitement; 2. Une fois que le WebAPI a terminé la tache en arrière-plan, il met le rappel dans la file d'attente correspondante (macro tache ou micro tache); 3. La boucle d'événement vérifie si la pile d'appels est vide. S'il est vide, le rappel est retiré de la file d'attente et poussé dans la pile d'appels pour l'exécution; 4. Micro taches (comme Promise. puis) ??prendre la priorité sur les taches macro (telles que Settimeout); 5. Comprendre la boucle d'événements permet d'éviter de bloquer le thread principal et d'optimiser l'ordre d'exécution du code.</p> </div> <div id="377j5v51b" class="phphistorical_Version2_mids"> <a href="http://www.miracleart.cn/fr/faq/1796832598.html" title="Comprendre l'événement bouillonnant et capturer dans les événements JavaScript DOM" 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/175191340168611.jpg?x-oss-process=image/resize,m_fill,h_207,w_330" alt="Comprendre l'événement bouillonnant et capturer dans les événements JavaScript DOM" /> </a> <a href="http://www.miracleart.cn/fr/faq/1796832598.html" title="Comprendre l'événement bouillonnant et capturer dans les événements JavaScript DOM" class="phphistorical_Version2_mids_title">Comprendre l'événement bouillonnant et capturer dans les événements JavaScript DOM</a> <span id="377j5v51b" class="Articlelist_txts_time">Jul 08, 2025 am 02:36 AM</span> <p class="Articlelist_txts_p">Les bulles d'événements se propagent de l'élément cible vers l'extérieur vers le n?ud d'ancêtre, tandis que la capture d'événements se propage de la couche externe vers l'intérieur vers l'élément cible. 1. événements Bubbles: Après avoir cliqué sur l'élément enfant, l'événement déclenche l'auditeur de l'élément parent vers le haut. Par exemple, après avoir cliqué sur le bouton, il sortira d'abord cliqué sur l'enfant, puis parent. 2. Capture d'événement: définissez le troisième paramètre sur true, afin que l'auditeur soit exécuté dans l'étape de capture, tels que le déclenchement de l'écouteur de capture de l'élément parent avant de cliquer sur le bouton. 3. Les utilisations pratiques incluent la gestion unifiée des événements d'éléments enfants, le prétraitement d'interception et l'optimisation des performances. 4. Le flux d'événements DOM est divisé en trois étapes: capture, cible et bulle, et l'écouteur par défaut est exécuté dans l'étape de la bulle.</p> </div> <div id="377j5v51b" class="phphistorical_Version2_mids"> <a href="http://www.miracleart.cn/fr/faq/1796833774.html" title="Un tour d'horizon des fonctions d'ordre supérieur au-delà de la carte et du filtre" 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/175211891141086.jpg?x-oss-process=image/resize,m_fill,h_207,w_330" alt="Un tour d'horizon des fonctions d'ordre supérieur au-delà de la carte et du filtre" /> </a> <a href="http://www.miracleart.cn/fr/faq/1796833774.html" title="Un tour d'horizon des fonctions d'ordre supérieur au-delà de la carte et du filtre" class="phphistorical_Version2_mids_title">Un tour d'horizon des fonctions d'ordre supérieur au-delà de la carte et du filtre</a> <span id="377j5v51b" class="Articlelist_txts_time">Jul 10, 2025 am 11:41 AM</span> <p class="Articlelist_txts_p">Dans les tableaux JavaScript, en plus de la carte et du filtre, il existe d'autres méthodes puissantes et rarement utilisées. 1. La réduction peut non seulement résumer, mais également compter, se regrouper, aplatir les tableaux et construire de nouvelles structures; 2. Find et FindIndex sont utilisés pour trouver des éléments ou des index individuels; 3.Il et tout sont utilisés pour déterminer si les conditions existent ou que toutes les personnes se rencontrent; 4.Sort peut être trié mais changera le tableau d'origine; 5. Faites attention à la copie du tableau lorsque vous l'utilisez pour éviter les effets secondaires. Ces méthodes rendent le code plus concis et efficace.</p> </div> </div> <a href="http://www.miracleart.cn/fr/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="377j5v51b" class="footer"> <div id="377j5v51b" class="footertop"> <img src="/static/imghw/logo.png" alt=""> <p>Formation PHP en ligne sur le bien-être public,Aidez les apprenants PHP à grandir rapidement!</p> </div> <div id="377j5v51b" class="footermid"> <a href="http://www.miracleart.cn/fr/about/us.html">à propos de nous</a> <a href="http://www.miracleart.cn/fr/about/disclaimer.html">Clause de non-responsabilité</a> <a href="http://www.miracleart.cn/fr/update/article_0_1.html">Sitemap</a> </div> <div id="377j5v51b" 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://www.miracleart.cn/" title="国产av日韩一区二区三区精品">国产av日韩一区二区三区精品</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="ux77o" class="pl_css_ganrao" style="display: none;"><listing id="ux77o"><pre id="ux77o"><var id="ux77o"><form id="ux77o"></form></var></pre></listing><progress id="ux77o"></progress><mark id="ux77o"></mark><ruby id="ux77o"></ruby><mark id="ux77o"><thead id="ux77o"><dfn id="ux77o"><var id="ux77o"></var></dfn></thead></mark><acronym id="ux77o"></acronym><pre id="ux77o"></pre><legend id="ux77o"><th id="ux77o"></th></legend><delect id="ux77o"></delect><p id="ux77o"></p><font id="ux77o"><style id="ux77o"><progress id="ux77o"><small id="ux77o"></small></progress></style></font><font id="ux77o"><style id="ux77o"></style></font><form id="ux77o"><strong id="ux77o"><div id="ux77o"></div></strong></form><p id="ux77o"><rp id="ux77o"></rp></p><style id="ux77o"><ins id="ux77o"><dfn id="ux77o"><pre id="ux77o"></pre></dfn></ins></style><thead id="ux77o"></thead><em id="ux77o"><pre id="ux77o"><b id="ux77o"><td id="ux77o"></td></b></pre></em><nobr id="ux77o"><sup id="ux77o"><table id="ux77o"><wbr id="ux77o"></wbr></table></sup></nobr><dl id="ux77o"><dfn id="ux77o"><td id="ux77o"><form id="ux77o"></form></td></dfn></dl><acronym id="ux77o"><u id="ux77o"></u></acronym><em id="ux77o"></em><tbody id="ux77o"></tbody><td id="ux77o"><kbd id="ux77o"><div id="ux77o"></div></kbd></td><strong id="ux77o"></strong><label id="ux77o"></label><dl id="ux77o"></dl><mark id="ux77o"><strong id="ux77o"><mark id="ux77o"><label id="ux77o"></label></mark></strong></mark><option id="ux77o"><acronym id="ux77o"><u id="ux77o"><center id="ux77o"></center></u></acronym></option><label id="ux77o"><legend id="ux77o"><th id="ux77o"></th></legend></label><strike id="ux77o"><video id="ux77o"><pre id="ux77o"><abbr id="ux77o"></abbr></pre></video></strike><acronym id="ux77o"></acronym><tt id="ux77o"></tt><strike id="ux77o"><th id="ux77o"></th></strike><pre id="ux77o"></pre><div id="ux77o"></div><optgroup id="ux77o"><td id="ux77o"><pre id="ux77o"></pre></td></optgroup><p id="ux77o"></p><video id="ux77o"></video><nav id="ux77o"></nav><samp id="ux77o"></samp><samp id="ux77o"><i id="ux77o"></i></samp><progress id="ux77o"></progress><fieldset id="ux77o"><rp id="ux77o"></rp></fieldset><label id="ux77o"><tt id="ux77o"><style id="ux77o"><delect id="ux77o"></delect></style></tt></label><source id="ux77o"><dfn id="ux77o"><div id="ux77o"><rp id="ux77o"></rp></div></dfn></source><s id="ux77o"><b id="ux77o"><thead id="ux77o"></thead></b></s><ul id="ux77o"><legend id="ux77o"><menuitem id="ux77o"><dl id="ux77o"></dl></menuitem></legend></ul><em id="ux77o"><s id="ux77o"></s></em><nobr id="ux77o"><tr id="ux77o"><dfn id="ux77o"><thead id="ux77o"></thead></dfn></tr></nobr><cite id="ux77o"></cite></div> </html>