{"id":279,"date":"2018-02-10T13:45:50","date_gmt":"2018-02-10T12:45:50","guid":{"rendered":"https:\/\/numa-bord.com\/miniblog\/?p=279"},"modified":"2018-02-10T13:52:07","modified_gmt":"2018-02-10T12:52:07","slug":"jquery-trier-elements-fonction-dattributs-data","status":"publish","type":"post","link":"https:\/\/numa-bord.com\/miniblog\/jquery-trier-elements-fonction-dattributs-data\/","title":{"rendered":"Jquery : Trier des \u00e9l\u00e9ments en fonction d’attributs data-*"},"content":{"rendered":"

Nous allons voir aujourd’hui comment classer des \u00e9l\u00e9ments d’une page en fonctions de certaines donn\u00e9es (nom, position) gr\u00e2ce \u00e0 quelques lignes de javascript.
\nLa d\u00e9monstration du r\u00e9sultat que l’on va obtenir est visible ici<\/a><\/p>\n

On commence par cr\u00e9er notre html de mani\u00e8re classique, comme d’habitude j’importe bootstrap et jquery pour la forme et la simplicit\u00e9.
\nEn plus de \u00e7a on affiche dans notre page une s\u00e9rie d’\u00e9l\u00e9ment ayant la classe \u00ab\u00a0card\u00a0\u00bb ainsi que des attributs \u00ab\u00a0data-position\u00a0\u00bb, \u00ab\u00a0data-note\u00a0\u00bb et \u00ab\u00a0data-name\u00a0\u00bb pour stocker les valeurs sur lesquelles on va effectuer le classement. On affiche auparavant un \u00ab\u00a0select\u00a0\u00bb qui nous permettra de choisir l’ordre que l’on souhaite afficher.<\/p>\n

<!DOCTYPE html><\/span>
\n<html<\/span><\/a>><\/span>
\n    <head<\/span><\/a>><\/span>
\n        <meta<\/span><\/a> charset<\/span>=<\/span>"UTF-8"<\/span>><\/span>
\n        <meta<\/span><\/a> name<\/span>=<\/span>"viewport"<\/span> content<\/span>=<\/span>"width=device-width, initial-scale=1.0"<\/span>><\/span>
\n        <!-- CSS --><\/span>
\n        <link<\/span><\/a> rel<\/span>=<\/span>"stylesheet"<\/span> href<\/span>=<\/span>"https:\/\/maxcdn.bootstrapcdn.com\/bootstrap\/4.0.0\/css\/bootstrap.min.css"<\/span>><\/span>
\n        <link<\/span><\/a> rel<\/span>=<\/span>"stylesheet"<\/span> href<\/span>=<\/span>".\/css\/style.css"<\/span>><\/span>
\n        <!-- JS --><\/span>
\n        <script<\/span><\/a> src<\/span>=<\/span>".\/js\/jquery-3.3.1.min.js"<\/span>><\/<\/span>script<\/span><\/a>><\/span>
\n        <script<\/span><\/a> src<\/span>=<\/span>".\/js\/custom.js"<\/span>><\/<\/span>script<\/span><\/a>><\/span>
\n    <\/<\/span>head<\/span><\/a>><\/span>
\n    <body<\/span><\/a>><\/span>
\n        <div<\/span><\/a> class<\/span>=<\/span>"container main-container"<\/span>><\/span>
\n            <div<\/span><\/a> class<\/span>=<\/span>"form-group"<\/span>><\/span>
\n                <label<\/span><\/a> for<\/span>=<\/span>"select-order"<\/span>><\/span>Classer par<\/<\/span>label<\/span><\/a>><\/span>
\n                <select<\/span><\/a> class<\/span>=<\/span>"form-control"<\/span> id<\/span>=<\/span>"select-order"<\/span>><\/span>
\n                    <option<\/span><\/a> value<\/span>=<\/span>"position"<\/span>><\/span>Position<\/<\/span>option<\/span><\/a>><\/span>
\n                    <option<\/span><\/a> value<\/span>=<\/span>"note"<\/span>><\/span>Note<\/<\/span>option<\/span><\/a>><\/span>
\n                    <option<\/span><\/a> value<\/span>=<\/span>"name"<\/span>><\/span>Nom<\/<\/span>option<\/span><\/a>><\/span>
\n                <\/<\/span>select<\/span><\/a>><\/span>
\n            <\/<\/span>div<\/span><\/a>><\/span>
\n            <div<\/span><\/a> class<\/span>=<\/span>"card-container row"<\/span>><\/span>
\n                <div<\/span><\/a> class<\/span>=<\/span>"item col-md-4"<\/span> data-position=<\/span>"1"<\/span> data-note=<\/span>"8"<\/span> data-name<\/span>=<\/span>"Paul"<\/span>><\/span>
\n                    <div<\/span><\/a> class<\/span>=<\/span>"card mb-3"<\/span>><\/span>
\n                        <img<\/span><\/a> class<\/span>=<\/span>"card-img-top"<\/span> src<\/span>=<\/span>"http:\/\/lorempixel.com\/400\/200\/abstract"<\/span> alt<\/span>=<\/span>"illustration"<\/span>><\/span>
\n                        <div<\/span><\/a> class<\/span>=<\/span>"card-body"<\/span>><\/span>
\n                            <h3<\/span><\/a> class<\/span>=<\/span>"card-title"<\/span>><\/span>Paul<\/<\/span>h3<\/span><\/a>><\/span>
\n                            <div<\/span><\/a> class<\/span>=<\/span>"card-subtitle"<\/span>><\/span>Position : 1<\/<\/span>div<\/span><\/a>><\/span>
\n                            <div<\/span><\/a> class<\/span>=<\/span>"card-text"<\/span>><\/span>Note : 8<\/<\/span>div<\/span><\/a>><\/span>
\n                        <\/<\/span>div<\/span><\/a>><\/span>
\n                    <\/<\/span>div<\/span><\/a>><\/span>
\n                <\/<\/span>div<\/span><\/a>><\/span>
\n                <!-- d'autres \u00e9l\u00e9ments avec diff\u00e9rentes valeurs --><\/span>
\n            <\/<\/span>div<\/span><\/a>><\/span>
\n        <\/<\/span>div<\/span><\/a>><\/span>
\n    <\/<\/span>body<\/span><\/a>><\/span>
\n<\/<\/span>html<\/span><\/a>><\/span><\/div><\/div>\n

On va maintenant s’occuper du javascript qui nous permettra de r\u00e9ordonner les \u00e9l\u00e9ments, il s’agit de d\u00e9tecter le choix s\u00e9lectionn\u00e9 et de lancer le tri (num\u00e9rique, num\u00e9rique invers\u00e9 ou alphab\u00e9tique) sur nos attributs data-*. Le code suivant est suffisant :<\/p>\n

$(<\/span>document)<\/span>.ready<\/span>(<\/span>function<\/span> (<\/span>)<\/span> {<\/span>
\n    \/* \u00e0 la s\u00e9lection du classement on met \u00e0 jour *\/<\/span>
\n    $(<\/span>document)<\/span>.on<\/span>(<\/span>"change"<\/span>,<\/span> "#select-order"<\/span>,<\/span> function<\/span> (<\/span>)<\/span> {<\/span>
\n        updateOrder(<\/span>)<\/span>;<\/span>
\n    }<\/span>)<\/span>;<\/span>
\n    \/* au chargement de la page on lance le classement *\/<\/span>
\n    updateOrder(<\/span>)<\/span>;<\/span>
\n}<\/span>)<\/span>;<\/span>
\n
\nfunction<\/span> updateOrder(<\/span>)<\/span> {<\/span>
\n    var<\/span> order =<\/span> $(<\/span>"#select-order"<\/span>)<\/span>.val<\/span>(<\/span>)<\/span>;<\/span>
\n    if<\/span> (<\/span>order ==<\/span> 'position'<\/span> ||<\/span> order ==<\/span> 'note'<\/span> ||<\/span> order ==<\/span> 'name'<\/span>)<\/span> {<\/span>
\n        var<\/span> divList =<\/span> $(<\/span>".card"<\/span>)<\/span>;<\/span>
\n        if<\/span> (<\/span>order ==<\/span> 'position'<\/span>)<\/span> {<\/span> \/\/tri numerique croissant<\/span>
\n            divList.sort<\/span>(<\/span>function<\/span> (<\/span>a,<\/span> b)<\/span> {<\/span>
\n                return<\/span>  $(<\/span>a)<\/span>.data<\/span>(<\/span>order)<\/span> -<\/span> $(<\/span>b)<\/span>.data<\/span>(<\/span>order)<\/span>;<\/span>
\n            }<\/span>)<\/span>;<\/span>
\n        }<\/span> else<\/span> if<\/span> (<\/span>order ==<\/span> 'note'<\/span>)<\/span> {<\/span>\/\/tri numerique decroissant<\/span>
\n            divList.sort<\/span>(<\/span>function<\/span> (<\/span>a,<\/span> b)<\/span> {<\/span>
\n                return<\/span> $(<\/span>b)<\/span>.data<\/span>(<\/span>order)<\/span> -<\/span> $(<\/span>a)<\/span>.data<\/span>(<\/span>order)<\/span>;<\/span>
\n            }<\/span>)<\/span>;<\/span>
\n        }<\/span> else<\/span> if<\/span> (<\/span>order ==<\/span> 'name'<\/span>)<\/span> {<\/span> \/\/tri alphabetique<\/span>
\n            divList.sort<\/span>(<\/span>function<\/span> (<\/span>a,<\/span> b)<\/span> {<\/span>
\n                var<\/span> compA =<\/span> $(<\/span>a)<\/span>.data<\/span>(<\/span>order)<\/span>.toUpperCase<\/span>(<\/span>)<\/span>;<\/span>
\n                var<\/span> compB =<\/span> $(<\/span>b)<\/span>.data<\/span>(<\/span>order)<\/span>.toUpperCase<\/span>(<\/span>)<\/span>;<\/span>
\n                return<\/span> (<\/span>compA <<\/span> compB)<\/span> ?<\/span> -<\/span>1<\/span> :<\/span> (<\/span>compA ><\/span> compB)<\/span> ?<\/span> 1<\/span> :<\/span> 0<\/span>;<\/span>
\n            }<\/span>)<\/span>;<\/span>
\n        }<\/span>
\n        $(<\/span>".card-container"<\/span>)<\/span>.html<\/span>(<\/span>divList)<\/span>;<\/span>
\n    }<\/span>
\n}<\/span><\/div><\/div>\n","protected":false},"excerpt":{"rendered":"

Nous allons voir aujourd’hui comment classer des \u00e9l\u00e9ments d’une page en fonctions de certaines donn\u00e9es (nom, position) gr\u00e2ce \u00e0 quelques lignes de javascript. La d\u00e9monstration du r\u00e9sultat que l’on va obtenir est visible ici On commence par cr\u00e9er notre html de mani\u00e8re classique, comme d’habitude j’importe bootstrap et jquery pour la forme et la simplicit\u00e9. […]<\/p>\n","protected":false},"author":1,"featured_media":0,"comment_status":"open","ping_status":"open","sticky":false,"template":"","format":"standard","meta":{"_acf_changed":false,"footnotes":""},"categories":[2,11,12],"tags":[],"class_list":["post-279","post","type-post","status-publish","format-standard","hentry","category-developpement","category-javascript","category-jquery"],"acf":[],"yoast_head":"\nJquery : Trier des \u00e9l\u00e9ments en fonction d'attributs data-* - Pense b\u00eate d'un d\u00e9veloppeur web<\/title>\n<meta name=\"robots\" content=\"index, follow, max-snippet:-1, max-image-preview:large, max-video-preview:-1\" \/>\n<link rel=\"canonical\" href=\"https:\/\/numa-bord.com\/miniblog\/jquery-trier-elements-fonction-dattributs-data\/\" \/>\n<meta property=\"og:locale\" content=\"fr_FR\" \/>\n<meta property=\"og:type\" content=\"article\" \/>\n<meta property=\"og:title\" content=\"Jquery : Trier des \u00e9l\u00e9ments en fonction d'attributs data-* - Pense b\u00eate d'un d\u00e9veloppeur web\" \/>\n<meta property=\"og:description\" content=\"Nous allons voir aujourd’hui comment classer des \u00e9l\u00e9ments d’une page en fonctions de certaines donn\u00e9es (nom, position) gr\u00e2ce \u00e0 quelques lignes de javascript. La d\u00e9monstration du r\u00e9sultat que l’on va obtenir est visible ici On commence par cr\u00e9er notre html de mani\u00e8re classique, comme d’habitude j’importe bootstrap et jquery pour la forme et la simplicit\u00e9. […]\" \/>\n<meta property=\"og:url\" content=\"https:\/\/numa-bord.com\/miniblog\/jquery-trier-elements-fonction-dattributs-data\/\" \/>\n<meta property=\"og:site_name\" content=\"Pense b\u00eate d'un d\u00e9veloppeur web\" \/>\n<meta property=\"article:published_time\" content=\"2018-02-10T12:45:50+00:00\" \/>\n<meta property=\"article:modified_time\" content=\"2018-02-10T12:52:07+00:00\" \/>\n<meta property=\"og:image\" content=\"http:\/\/lorempixel.com\/400\/200\/abstract\" \/>\n<meta name=\"author\" content=\"Numa\" \/>\n<meta name=\"twitter:card\" content=\"summary_large_image\" \/>\n<meta name=\"twitter:label1\" content=\"\u00c9crit par\" \/>\n\t<meta name=\"twitter:data1\" content=\"Numa\" \/>\n\t<meta name=\"twitter:label2\" content=\"Dur\u00e9e de lecture estim\u00e9e\" \/>\n\t<meta name=\"twitter:data2\" content=\"1 minute\" \/>\n<script type=\"application\/ld+json\" class=\"yoast-schema-graph\">{\"@context\":\"https:\/\/schema.org\",\"@graph\":[{\"@type\":\"Article\",\"@id\":\"https:\/\/numa-bord.com\/miniblog\/jquery-trier-elements-fonction-dattributs-data\/#article\",\"isPartOf\":{\"@id\":\"https:\/\/numa-bord.com\/miniblog\/jquery-trier-elements-fonction-dattributs-data\/\"},\"author\":{\"name\":\"Numa\",\"@id\":\"https:\/\/numa-bord.com\/miniblog\/#\/schema\/person\/f9d00acd1703f17e5a6895283eb46a7e\"},\"headline\":\"Jquery : Trier des \u00e9l\u00e9ments en fonction d’attributs data-*\",\"datePublished\":\"2018-02-10T12:45:50+00:00\",\"dateModified\":\"2018-02-10T12:52:07+00:00\",\"mainEntityOfPage\":{\"@id\":\"https:\/\/numa-bord.com\/miniblog\/jquery-trier-elements-fonction-dattributs-data\/\"},\"wordCount\":309,\"commentCount\":0,\"image\":{\"@id\":\"https:\/\/numa-bord.com\/miniblog\/jquery-trier-elements-fonction-dattributs-data\/#primaryimage\"},\"thumbnailUrl\":\"http:\/\/lorempixel.com\/400\/200\/abstract\",\"articleSection\":[\"D\u00e9veloppement\",\"Javascript\",\"jQuery\"],\"inLanguage\":\"fr-FR\",\"potentialAction\":[{\"@type\":\"CommentAction\",\"name\":\"Comment\",\"target\":[\"https:\/\/numa-bord.com\/miniblog\/jquery-trier-elements-fonction-dattributs-data\/#respond\"]}]},{\"@type\":\"WebPage\",\"@id\":\"https:\/\/numa-bord.com\/miniblog\/jquery-trier-elements-fonction-dattributs-data\/\",\"url\":\"https:\/\/numa-bord.com\/miniblog\/jquery-trier-elements-fonction-dattributs-data\/\",\"name\":\"Jquery : Trier des \u00e9l\u00e9ments en fonction d'attributs data-* - Pense b\u00eate d'un d\u00e9veloppeur web\",\"isPartOf\":{\"@id\":\"https:\/\/numa-bord.com\/miniblog\/#website\"},\"primaryImageOfPage\":{\"@id\":\"https:\/\/numa-bord.com\/miniblog\/jquery-trier-elements-fonction-dattributs-data\/#primaryimage\"},\"image\":{\"@id\":\"https:\/\/numa-bord.com\/miniblog\/jquery-trier-elements-fonction-dattributs-data\/#primaryimage\"},\"thumbnailUrl\":\"http:\/\/lorempixel.com\/400\/200\/abstract\",\"datePublished\":\"2018-02-10T12:45:50+00:00\",\"dateModified\":\"2018-02-10T12:52:07+00:00\",\"author\":{\"@id\":\"https:\/\/numa-bord.com\/miniblog\/#\/schema\/person\/f9d00acd1703f17e5a6895283eb46a7e\"},\"breadcrumb\":{\"@id\":\"https:\/\/numa-bord.com\/miniblog\/jquery-trier-elements-fonction-dattributs-data\/#breadcrumb\"},\"inLanguage\":\"fr-FR\",\"potentialAction\":[{\"@type\":\"ReadAction\",\"target\":[\"https:\/\/numa-bord.com\/miniblog\/jquery-trier-elements-fonction-dattributs-data\/\"]}]},{\"@type\":\"ImageObject\",\"inLanguage\":\"fr-FR\",\"@id\":\"https:\/\/numa-bord.com\/miniblog\/jquery-trier-elements-fonction-dattributs-data\/#primaryimage\",\"url\":\"http:\/\/lorempixel.com\/400\/200\/abstract\",\"contentUrl\":\"http:\/\/lorempixel.com\/400\/200\/abstract\"},{\"@type\":\"BreadcrumbList\",\"@id\":\"https:\/\/numa-bord.com\/miniblog\/jquery-trier-elements-fonction-dattributs-data\/#breadcrumb\",\"itemListElement\":[{\"@type\":\"ListItem\",\"position\":1,\"name\":\"Accueil\",\"item\":\"https:\/\/numa-bord.com\/miniblog\/\"},{\"@type\":\"ListItem\",\"position\":2,\"name\":\"Jquery : Trier des \u00e9l\u00e9ments en fonction d’attributs data-*\"}]},{\"@type\":\"WebSite\",\"@id\":\"https:\/\/numa-bord.com\/miniblog\/#website\",\"url\":\"https:\/\/numa-bord.com\/miniblog\/\",\"name\":\"Pense b\u00eate d'un d\u00e9veloppeur web\",\"description\":\"(php, javascript, Symfony, Wordpress....)\",\"potentialAction\":[{\"@type\":\"SearchAction\",\"target\":{\"@type\":\"EntryPoint\",\"urlTemplate\":\"https:\/\/numa-bord.com\/miniblog\/?s={search_term_string}\"},\"query-input\":{\"@type\":\"PropertyValueSpecification\",\"valueRequired\":true,\"valueName\":\"search_term_string\"}}],\"inLanguage\":\"fr-FR\"},{\"@type\":\"Person\",\"@id\":\"https:\/\/numa-bord.com\/miniblog\/#\/schema\/person\/f9d00acd1703f17e5a6895283eb46a7e\",\"name\":\"Numa\",\"image\":{\"@type\":\"ImageObject\",\"inLanguage\":\"fr-FR\",\"@id\":\"https:\/\/secure.gravatar.com\/avatar\/f21d1af4658a7106211915940584534c1e0b3eef3f12eb67a697686cad70b64a?s=96&d=mm&r=g\",\"url\":\"https:\/\/secure.gravatar.com\/avatar\/f21d1af4658a7106211915940584534c1e0b3eef3f12eb67a697686cad70b64a?s=96&d=mm&r=g\",\"contentUrl\":\"https:\/\/secure.gravatar.com\/avatar\/f21d1af4658a7106211915940584534c1e0b3eef3f12eb67a697686cad70b64a?s=96&d=mm&r=g\",\"caption\":\"Numa\"},\"url\":\"https:\/\/numa-bord.com\/miniblog\/author\/negonner\/\"}]}<\/script>\n<!-- \/ Yoast SEO plugin. -->","yoast_head_json":{"title":"Jquery : Trier des \u00e9l\u00e9ments en fonction d'attributs data-* - Pense b\u00eate d'un d\u00e9veloppeur web","robots":{"index":"index","follow":"follow","max-snippet":"max-snippet:-1","max-image-preview":"max-image-preview:large","max-video-preview":"max-video-preview:-1"},"canonical":"https:\/\/numa-bord.com\/miniblog\/jquery-trier-elements-fonction-dattributs-data\/","og_locale":"fr_FR","og_type":"article","og_title":"Jquery : Trier des \u00e9l\u00e9ments en fonction d'attributs data-* - Pense b\u00eate d'un d\u00e9veloppeur web","og_description":"Nous allons voir aujourd’hui comment classer des \u00e9l\u00e9ments d’une page en fonctions de certaines donn\u00e9es (nom, position) gr\u00e2ce \u00e0 quelques lignes de javascript. La d\u00e9monstration du r\u00e9sultat que l’on va obtenir est visible ici On commence par cr\u00e9er notre html de mani\u00e8re classique, comme d’habitude j’importe bootstrap et jquery pour la forme et la simplicit\u00e9. […]","og_url":"https:\/\/numa-bord.com\/miniblog\/jquery-trier-elements-fonction-dattributs-data\/","og_site_name":"Pense b\u00eate d'un d\u00e9veloppeur web","article_published_time":"2018-02-10T12:45:50+00:00","article_modified_time":"2018-02-10T12:52:07+00:00","og_image":[{"url":"http:\/\/lorempixel.com\/400\/200\/abstract","type":"","width":"","height":""}],"author":"Numa","twitter_card":"summary_large_image","twitter_misc":{"\u00c9crit par":"Numa","Dur\u00e9e de lecture estim\u00e9e":"1 minute"},"schema":{"@context":"https:\/\/schema.org","@graph":[{"@type":"Article","@id":"https:\/\/numa-bord.com\/miniblog\/jquery-trier-elements-fonction-dattributs-data\/#article","isPartOf":{"@id":"https:\/\/numa-bord.com\/miniblog\/jquery-trier-elements-fonction-dattributs-data\/"},"author":{"name":"Numa","@id":"https:\/\/numa-bord.com\/miniblog\/#\/schema\/person\/f9d00acd1703f17e5a6895283eb46a7e"},"headline":"Jquery : Trier des \u00e9l\u00e9ments en fonction d’attributs data-*","datePublished":"2018-02-10T12:45:50+00:00","dateModified":"2018-02-10T12:52:07+00:00","mainEntityOfPage":{"@id":"https:\/\/numa-bord.com\/miniblog\/jquery-trier-elements-fonction-dattributs-data\/"},"wordCount":309,"commentCount":0,"image":{"@id":"https:\/\/numa-bord.com\/miniblog\/jquery-trier-elements-fonction-dattributs-data\/#primaryimage"},"thumbnailUrl":"http:\/\/lorempixel.com\/400\/200\/abstract","articleSection":["D\u00e9veloppement","Javascript","jQuery"],"inLanguage":"fr-FR","potentialAction":[{"@type":"CommentAction","name":"Comment","target":["https:\/\/numa-bord.com\/miniblog\/jquery-trier-elements-fonction-dattributs-data\/#respond"]}]},{"@type":"WebPage","@id":"https:\/\/numa-bord.com\/miniblog\/jquery-trier-elements-fonction-dattributs-data\/","url":"https:\/\/numa-bord.com\/miniblog\/jquery-trier-elements-fonction-dattributs-data\/","name":"Jquery : Trier des \u00e9l\u00e9ments en fonction d'attributs data-* - Pense b\u00eate d'un d\u00e9veloppeur web","isPartOf":{"@id":"https:\/\/numa-bord.com\/miniblog\/#website"},"primaryImageOfPage":{"@id":"https:\/\/numa-bord.com\/miniblog\/jquery-trier-elements-fonction-dattributs-data\/#primaryimage"},"image":{"@id":"https:\/\/numa-bord.com\/miniblog\/jquery-trier-elements-fonction-dattributs-data\/#primaryimage"},"thumbnailUrl":"http:\/\/lorempixel.com\/400\/200\/abstract","datePublished":"2018-02-10T12:45:50+00:00","dateModified":"2018-02-10T12:52:07+00:00","author":{"@id":"https:\/\/numa-bord.com\/miniblog\/#\/schema\/person\/f9d00acd1703f17e5a6895283eb46a7e"},"breadcrumb":{"@id":"https:\/\/numa-bord.com\/miniblog\/jquery-trier-elements-fonction-dattributs-data\/#breadcrumb"},"inLanguage":"fr-FR","potentialAction":[{"@type":"ReadAction","target":["https:\/\/numa-bord.com\/miniblog\/jquery-trier-elements-fonction-dattributs-data\/"]}]},{"@type":"ImageObject","inLanguage":"fr-FR","@id":"https:\/\/numa-bord.com\/miniblog\/jquery-trier-elements-fonction-dattributs-data\/#primaryimage","url":"http:\/\/lorempixel.com\/400\/200\/abstract","contentUrl":"http:\/\/lorempixel.com\/400\/200\/abstract"},{"@type":"BreadcrumbList","@id":"https:\/\/numa-bord.com\/miniblog\/jquery-trier-elements-fonction-dattributs-data\/#breadcrumb","itemListElement":[{"@type":"ListItem","position":1,"name":"Accueil","item":"https:\/\/numa-bord.com\/miniblog\/"},{"@type":"ListItem","position":2,"name":"Jquery : Trier des \u00e9l\u00e9ments en fonction d’attributs data-*"}]},{"@type":"WebSite","@id":"https:\/\/numa-bord.com\/miniblog\/#website","url":"https:\/\/numa-bord.com\/miniblog\/","name":"Pense b\u00eate d'un d\u00e9veloppeur web","description":"(php, javascript, Symfony, Wordpress....)","potentialAction":[{"@type":"SearchAction","target":{"@type":"EntryPoint","urlTemplate":"https:\/\/numa-bord.com\/miniblog\/?s={search_term_string}"},"query-input":{"@type":"PropertyValueSpecification","valueRequired":true,"valueName":"search_term_string"}}],"inLanguage":"fr-FR"},{"@type":"Person","@id":"https:\/\/numa-bord.com\/miniblog\/#\/schema\/person\/f9d00acd1703f17e5a6895283eb46a7e","name":"Numa","image":{"@type":"ImageObject","inLanguage":"fr-FR","@id":"https:\/\/secure.gravatar.com\/avatar\/f21d1af4658a7106211915940584534c1e0b3eef3f12eb67a697686cad70b64a?s=96&d=mm&r=g","url":"https:\/\/secure.gravatar.com\/avatar\/f21d1af4658a7106211915940584534c1e0b3eef3f12eb67a697686cad70b64a?s=96&d=mm&r=g","contentUrl":"https:\/\/secure.gravatar.com\/avatar\/f21d1af4658a7106211915940584534c1e0b3eef3f12eb67a697686cad70b64a?s=96&d=mm&r=g","caption":"Numa"},"url":"https:\/\/numa-bord.com\/miniblog\/author\/negonner\/"}]}},"_links":{"self":[{"href":"https:\/\/numa-bord.com\/miniblog\/wp-json\/wp\/v2\/posts\/279","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/numa-bord.com\/miniblog\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/numa-bord.com\/miniblog\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/numa-bord.com\/miniblog\/wp-json\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/numa-bord.com\/miniblog\/wp-json\/wp\/v2\/comments?post=279"}],"version-history":[{"count":10,"href":"https:\/\/numa-bord.com\/miniblog\/wp-json\/wp\/v2\/posts\/279\/revisions"}],"predecessor-version":[{"id":290,"href":"https:\/\/numa-bord.com\/miniblog\/wp-json\/wp\/v2\/posts\/279\/revisions\/290"}],"wp:attachment":[{"href":"https:\/\/numa-bord.com\/miniblog\/wp-json\/wp\/v2\/media?parent=279"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/numa-bord.com\/miniblog\/wp-json\/wp\/v2\/categories?post=279"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/numa-bord.com\/miniblog\/wp-json\/wp\/v2\/tags?post=279"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}