Welkom op de Nederland Computer Kennisnetwerk!  
 
Zoeken computer kennis
Home Hardware Netwerken Programmering Software Computerstoring Besturingssysteem
* Computer Kennis >> Programmering >> JavaScript Programmeren >> Content
Hoe te gebruiken jQuery om een Anchor Invoegen
Als je denkt van het werken met Javascript voor uw volgende web -project , zal jQuery dingen een stuk makkelijker voor je te maken. jQuery is een Javascript -bibliotheek die is cross - browser compatible en vereenvoudigt het proces van het schrijven van Javascript -toepassingen . Een van de voordelen van het gebruik van Javascript is de mogelijkheid om dynamische inhoud invoegen in uw webpagina . U kunt document object model ( DOM ) elementen eenvoudig selecteren met jQuery 's ingebouwde DOM selector genaamd " Sizzle . " JQuery vereenvoudigt ook het proces van het maken en invoegen van pagina-elementen , zoals ankers , met zijn ingebouwde functies " append ( ) " en " prepend ( ) . " Wat je nodig hebt
Text Editor
Toon Meer Aanwijzingen
1

Maak een leeg bestand met de extensie " ; . html ' in uw tekstverwerker . We gaan een eenvoudige HTML- pagina die laat zien hoe u een anker in te voegen in een paar

< /div > HTML -tags met behulp van jQuery te creëren .

Kopie 2 de volgende code in het bestand u zojuist hebt gemaakt . Dit zal de basis HTML -structuur te creëren en zal jQuery importeren.

Hello World < /title > < script type = " text /javascript " <br> 3 <p> Maak een leeg paar <div> < /div > tags op uw pagina met een unieke ID ; " . say_hello " voor ons voorbeeld , zullen we gebruik Dit is waar wij zal voegen onze ankers . U kunt dit doen door de volgende code tussen de <body> < /body > tags: . <br> <p> <div Id="say_hello"> < /div > <br> < br > 4 <p> Kopieer de volgende code in de sectie <head><meta name="viewport" content="width=device-width, initial-scale=1.0"> van uw HTML- pagina . We zullen met behulp van de append ( ) of prepend ( ) jQuery library functie om twee ankers in te voegen in de div we zojuist hebt gemaakt . <br> <p> <script Type='text/javascript'> //< ! [ CDATA [ $ ( function ( ) { $ ( ' # say_hello ' ) . append ( " <a href=\\"www.google.com\\"> Hallo ! < /a > ' ) $ ( ' # say_hello ' ) . prepend ( " <a href=\\"www.bing.com\\"> Bye Bye ! < /a > ' ) } ) ;//] ] > < ;/script > <br> <p> je moet nu een div op uw pagina met twee ankers ingevoegd in het, een met anchor tekst " Hello! " en een met anchor tekst " Bye Bye ! " De eerste anker werd toegevoegd aan de div , en de tweede werd voorafgegaan aan de div . <br> <br></td> </tr> </table> <table border=0 cellSpacing=0 cellPadding=0 width=970 align=center height=90> <tr> <td bgColor=#e7edf4 align=middle><script language='javascript' src='/ad/201310/3.js'></script></td> </tr> </table> <table border=0 cellSpacing=0 cellPadding=0 width=970 align=center height=90> <tr> <td align=left>Previous: <a class='LinkPrevArticle' href='/programmering/javascript-programming/201309/90815.html' >Hoe maak All Radioknoppen False in JavaScript </a></li> </td> <td align=right>Next: <a class='LinkNextArticle' href='/programmering/javascript-programming/201309/90817.html' >Hoe de Marker wijzigen in een Google Maps API </a></li> </td> </tr> </table> </td> </tr> </table> <table border=0 cellSpacing=0 cellPadding=0 width=970 align=center height=18> <tr> <td></td> </tr> </table> <table border=0 cellSpacing=0 cellPadding=0 width=970 align=center height=246> <tr> <td height=246 vAlign=top width=199> <table class=bian border=0 cellSpacing=0 cellPadding=0 width=199> <tr> <td height=244 vAlign=top width=197> <table border=0 cellSpacing=0 cellPadding=0 width="100%" bgColor=#dbe3ee> <tr> <td height=29 width="4%"> </td> <td width="96%"><STRONG>JavaScript Programmeren</STRONG></td> </tr> </table> <table width="100%" cellpadding="0" cellspacing="0"><tr><td width="10" valign="top" class="">·</td><td class=""><a class="" href="/programmering/javascript-programming/201309/90746.html" title="IE 8 JavaScript Ongeldige pointer Fout " target="_self">IE 8 JavaScript Ongeldige poin…</a></td></tr><tr><td width="10" valign="top" class="">·</td><td class=""><a class="" href="/programmering/javascript-programming/201309/90981.html" title="Hoe kan ik een variabele lengte in Javascript Beperk " target="_self">Hoe kan ik een variabele lengt…</a></td></tr><tr><td width="10" valign="top" class="">·</td><td class=""><a class="" href="/programmering/javascript-programming/201309/91184.html" title="Hoe Vergelijk Java Script String " target="_self">Hoe Vergelijk Java Script Stri…</a></td></tr><tr><td width="10" valign="top" class="">·</td><td class=""><a class="" href="/programmering/javascript-programming/201309/91165.html" title="Intermediate - niveau Javascript Tutorial " target="_self">Intermediate - niveau Javascri…</a></td></tr><tr><td width="10" valign="top" class="">·</td><td class=""><a class="" href="/programmering/javascript-programming/201309/91191.html" title="Javascript Datum Tutorial " target="_self">Javascript Datum Tutorial </a></td></tr><tr><td width="10" valign="top" class="">·</td><td class=""><a class="" href="/programmering/javascript-programming/201309/91164.html" title="Hoe te schrijven Met behulp van Javascript " target="_self">Hoe te schrijven Met behulp va…</a></td></tr><tr><td width="10" valign="top" class="">·</td><td class=""><a class="" href="/programmering/javascript-programming/201309/91177.html" title="Array Javascript Tutorial " target="_self">Array Javascript Tutorial </a></td></tr><tr><td width="10" valign="top" class="">·</td><td class=""><a class="" href="/programmering/javascript-programming/201309/90828.html" title="Een tutorial voor HTML 5 Canvas Animatie " target="_self">Een tutorial voor HTML 5 Canva…</a></td></tr><tr><td width="10" valign="top" class="">·</td><td class=""><a class="" href="/programmering/javascript-programming/201309/91101.html" title="Waarom is Script vertragen mijn computer uit ? " target="_self">Waarom is Script vertragen mij…</a></td></tr><tr></tr></table></td> </tr> </table> </td> <td vAlign=top width=12></td> <td vAlign=top width=375> <table class=bian border=0 cellSpacing=0 cellPadding=0 width=375> <tr> <td height=244 vAlign=top> <table border=0 cellSpacing=0 cellPadding=0 width="100%" bgColor=#dbe3ee> <tr> <td height=29 width="4%"> </td> <td width="96%"><STRONG>Related Articles</STRONG></td> </tr> </table> <table border=0 cellSpacing=4 cellPadding=0 width="95%" align=center height=209> <tr> <td height=201 width="33%"><IMG src="/img_xby/n1.jpg" width=111 height=182></td> <td width="67%"><a class='LinkArticleCorrelative' href='/programmering/visual-basics-programming/201309/96568.html' target="_self">Hoe maak je een Combo Box Maak in Visual…</a><br><a class='LinkArticleCorrelative' href='/programmering/visual-basics-programming/201309/96567.html' target="_self">Hoe maak je een Check Box Maak in Visual…</a><br><a class='LinkArticleCorrelative' href='/programmering/visual-basics-programming/201309/96566.html' target="_self">Hoe maak je een tekstvak maken in Visual…</a><br><a class='LinkArticleCorrelative' href='/programmering/visual-basics-programming/201309/96565.html' target="_self">Hoe maak je een optie Box in Visual Basi…</a><br><a class='LinkArticleCorrelative' href='/programmering/visual-basics-programming/201309/96564.html' target="_self">Hoe maak je een schijf keuzelijst in Vis…</a><br><a class='LinkArticleCorrelative' href='/programmering/visual-basics-programming/201309/96563.html' target="_self">Hoe kan ik een keuzelijst maken in Visua…</a><br><a class='LinkArticleCorrelative' href='/programmering/visual-basics-programming/201309/96562.html' target="_self">Hoe kan ik een Picture Box Maak in Visua…</a><br><a class='LinkArticleCorrelative' href='/programmering/visual-basics-programming/201309/96561.html' target="_self">Hoe een bestand keuzelijst Maak in Visua…</a><br><a class='LinkArticleCorrelative' href='/programmering/visual-basics-programming/201309/96560.html' target="_self">Hoe kan ik een afbeelding Box Maak in Vi…</a><br></td> </tr> </table> </td> </tr> </table> </td> <td vAlign=top width=8></td> <td vAlign=top width=376> <table class=bian border=0 cellSpacing=0 cellPadding=0 width=375> <tr> <td height=244 vAlign=top> <table border=0 cellSpacing=0 cellPadding=0 width="100%" bgColor=#dbe3ee> <tr> <td height=29 width="4%"> </td> <td width="96%"><STRONG>Programmering Articles</STRONG></td> </tr> </table> <table border=0 cellSpacing=4 cellPadding=0 width="95%" align=center height=207> <tr> <td height=199 width="33%"><IMG src="/img_xby/n2.jpg" width=111 height=182></td> <td width="67%"> <table width="100%" cellpadding="0" cellspacing="0"><tr><td width="10" valign="top" class="">·</td><td class=""><a class="" href="/programmering/java-programming/201309/90630.html" title="Java Uitzonderingen Tutorial " target="_self">Java Uitzonderingen Tutorial </a></td></tr><tr><td width="10" valign="top" class="">·</td><td class=""><a class="" href="/programmering/java-programming/201309/90741.html" title="Hoe maak je een foto maken in een Schilderen Reproductie Photoshop " target="_self">Hoe maak je een foto maken in een Schild…</a></td></tr><tr><td width="10" valign="top" class="">·</td><td class=""><a class="" href="/programmering/visual-basics-programming/201309/95001.html" title="Hoe je VB Scripts installeren met Printers " target="_self">Hoe je VB Scripts installeren met Printe…</a></td></tr><tr><td width="10" valign="top" class="">·</td><td class=""><a class="" href="/programmering/visual-basics-programming/201309/96185.html" title="Hoe te Stored Procedures Bel in Visual Basic " target="_self">Hoe te Stored Procedures Bel in Visual B…</a></td></tr><tr><td width="10" valign="top" class="">·</td><td class=""><a class="" href="/programmering/visual-basics-programming/201309/96169.html" title="Hoe maak je een opgeslagen Procedure Call in een SQL Server Van VB " target="_self">Hoe maak je een opgeslagen Procedure Cal…</a></td></tr><tr><td width="10" valign="top" class="">·</td><td class=""><a class="" href="/programmering/computer-programming-languages/201309/88172.html" title="Wat is het verschil tussen XSL & XSD ? " target="_self">Wat is het verschil tussen XSL & XSD ? </a></td></tr><tr><td width="10" valign="top" class="">·</td><td class=""><a class="" href="/programmering/java-programming/201309/90206.html" title="Hoe maak je van een HashMap in Java initialiseren " target="_self">Hoe maak je van een HashMap in Java init…</a></td></tr><tr><td width="10" valign="top" class="">·</td><td class=""><a class="" href="/programmering/computer-programming-languages/201309/87885.html" title="Wat zijn Flowchart symbolen ? " target="_self">Wat zijn Flowchart symbolen ? </a></td></tr><tr><td width="10" valign="top" class="">·</td><td class=""><a class="" href="/programmering/visual-basics-programming/201309/96453.html" title="Hoe te programmeren met behulp van Visual Basic 6 " target="_self">Hoe te programmeren met behulp van Visua…</a></td></tr><tr></tr></table></td> </tr> </table> </td> </tr> </table> </td> </tr> </table> <table border=0 cellSpacing=0 cellPadding=0 width=970 align=center height=10> <tr> <td></td> </tr> </table> <table border=0 cellSpacing=0 cellPadding=0 width=970 align=center height=57> <tr> <td class=bs background=/img_xby/di.jpg align=center>Copyright © Computer Kennis http://www.nldit.com <script language='javascript' src='/ad/201310/5.js'></script></td> </tr> </table> <table border=0 cellSpacing=0 cellPadding=0 width=970 align=center height=10> <tr> <td></td> </tr> </table> </div> </body> </html>