Difference between revisions of "JQuery"
Jump to navigation
Jump to search
| Line 35: | Line 35: | ||
</body> | </body> | ||
</html> | </html> | ||
| + | </syntaxhighlight> | ||
| + | |||
| + | |||
| + | == jQuery Snippets == | ||
| + | === Replace any URL with clickable link === | ||
| + | <syntaxhighlight lang="javacript"> | ||
| + | $.fn.replaceUrl = function() { | ||
| + | var regexp = /((ftp|http|https)://(w+:{0,1}w*@)?(S+)(:[0-9]+)?(/|/([w#!:.?+=&%@!-/]))?)/gi; | ||
| + | this.each(function() { | ||
| + | $(this).html( | ||
| + | $(this).html().replace(regexp,'$1‘) | ||
| + | ); | ||
| + | }); | ||
| + | return $(this); | ||
| + | } | ||
| + | |||
| + | //usage | ||
| + | |||
| + | $('p').replaceUrl(); | ||
| + | </syntaxhighlight> | ||
| + | |||
| + | === Parse XML with jQuery === | ||
| + | <syntaxhighlight lang="javacript"> | ||
| + | function parseXml(xml) { | ||
| + | //find every Tutorial and print the author | ||
| + | $(xml).find("Tutorial").each(function() | ||
| + | { | ||
| + | $("#output").append($(this).attr("author") + ""); | ||
| + | }); | ||
| + | } | ||
</syntaxhighlight> | </syntaxhighlight> | ||
Revision as of 03:23, 4 June 2020
Documentation
Demo Bootstrap avec jquery
<syntaxhighlight lang="html"> <script src="https://code.jquery.com/jquery-3.5.1.slim.min.js"> </syntaxhighlight>
<syntaxhighlight lang="html">
<!doctype html>
<html lang="fr">
<head> <meta charset="utf-8"> <meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no">
<link rel="stylesheet" href="https://stackpath.bootstrapcdn.com/bootstrap/4.5.0/css/bootstrap.min.css" integrity="sha384-9aIt2nRpC12Uk9gS9baDl411NQApFmC26EwAOH8WgZl5MYYxFfc+NcPb1dKGj7Sk" crossorigin="anonymous">
<title>Hello, world!</title> </head> <body>
Hello, world!
<script src="https://code.jquery.com/jquery-3.5.1.slim.min.js" integrity="sha384-DfXdz2htPH0lsSSs5nCTpuj/zy4C+OGpamoFVy38MVBnE+IbbVYUew+OrCXaRkfj" crossorigin="anonymous"></script> <script src="https://cdn.jsdelivr.net/npm/popper.js@1.16.0/dist/umd/popper.min.js" integrity="sha384-Q6E9RHvbIyZFJoft+2mJbHaEWldlvI9IOYy5n3zV9zzTtmI3UksdQRVvoxMfooAo" crossorigin="anonymous"></script> <script src="https://stackpath.bootstrapcdn.com/bootstrap/4.5.0/js/bootstrap.min.js" integrity="sha384-OgVRvuATP1z7JjHLkuOU7Xw704+h835Lr+6QL9UvYjZE3Ipu6Tp75j7Bh/kR0JKI" crossorigin="anonymous"></script> </body>
</html> </syntaxhighlight>
jQuery Snippets
Replace any URL with clickable link
<syntaxhighlight lang="javacript"> $.fn.replaceUrl = function() { var regexp = /((ftp|http|https)://(w+:{0,1}w*@)?(S+)(:[0-9]+)?(/|/([w#!:.?+=&%@!-/]))?)/gi; this.each(function() { $(this).html( $(this).html().replace(regexp,'$1‘) ); }); return $(this); }
//usage
$('p').replaceUrl(); </syntaxhighlight>
Parse XML with jQuery
<syntaxhighlight lang="javacript"> function parseXml(xml) { //find every Tutorial and print the author $(xml).find("Tutorial").each(function() { $("#output").append($(this).attr("author") + ""); }); } </syntaxhighlight>