jQuery: obtenga una clase de elemento basada en un prefijo

Question

¿Cuál es la forma más rápida de obtener una cadena como "fade" de las clases en el elemento siguiente?

<div class="MyElement fx-fade"> ... </div> 

Answer 1

var classes = $('.MyElement').attr('class').split(' '); 
for (var i = 0; i < classes.length; i++) { 
    var matches = /^fx\-(.+)/.exec(classes[i]); 
    if (matches != null) { 
    var fxclass = matches[1]; 
    } 
} 

Answer 2

Echa un vistazo JQuery selector regular expressions. ¡Puede ser exactamente lo que necesitas! :)

Answer 3

Si quieres buscar algo que terminó en 'fade' se debería utilizar:

$("*[class$='fade']") 

Y para elementos con una clase que inició con 'fade' se debería utilizar:

$("*[class^='fade']") 

Y para obtener elementos que contienen 'fade' que usaría (esto sería más rápido que ir a través de la cadena de nombres de clase)

$("*[class*='fade']") 

El "*" obtiene todos los elementos para que pueda reemplazar esto con el elemento que desea.

Si desea que los elementos que tiene un nombre de clase que comienza con 'fx' que haría:

var classname = ""; 
var elArray = $("*[class*='fx-']"); 

for (var a= 0; a < elArray .length; a++) 
{ 
    //fade 
    classname = elArray[a].split("-")[1]; 
} 

La matriz utilizada en el bucle for tendría todos los elementos con los nombres de las clases como 'fx' .

En lugar de que el bucle for verifique los elementos para el nombre de clase correcto.

Más información en jquery.com

Answer 4

Prueba esto:

$("div[class*='fade']") 

More info

Answer 5

probablemente me vaya con algo como:

//Split class list into individual classes: 
var classes = $(".MyElement").attr("class").split(" "); 
var fxType; 

//Loop through them: 
for (var i = 0, max = classes.elngth; i < max; i++) { 
    var class = classes[i].split("-"); 
    //Check if the current one is prefixed with 'fx': 
    if (class[0] == "fx") { 
    //It is an FX - do whatever you want with it, the type of FX is stored in class[1], ie: 
    fxType = class[1]; 
    } 
} 

Answer 6

Este simple fragmento que utilizamos en nuestra sitios:

/** 
* Script to load a popup container for share buttons 
* 
* Possible usage for Facebook, Twitter and Google: 
* 
* <a class="share-buttons-fb" href="https://www.facebook.com/sharer/sharer.php?u=<?php echo get_the_permalink(); ?>&title=<?php the_title(); ?>">Facebook</a> 
* <a class="share-buttons-twitter" href="https://twitter.com/intent/tweet?text=<?php the_title(); ?>: <?php echo get_the_permalink(); ?>">Twitter</a> 
* <a class="share-buttons-google" href="http://plus.google.com/share?url=<?php echo get_the_permalink(); ?>">Google+</a> 
*/ 
jQuery(document).ready(function ($) { 

    // Whenever an anchor with the class with share-button in it is clicked 
    $("a[class*='share-button']").click(function() { 
     // Variables to set the size of the popup container 
     var windowWidth = 500; 
     var windowHeight = 255; 

     // Variables to set the position of the popup container 
     var positionWindowLeft = (screen.width/2) - (windowWidth/2); 
     var positionWindowTop = (screen.height/3) - (windowHeight/3); 

     // Create new windows with the opening url of the href attribute of the anchor and the above variables 
     var popupWindow = window.open($(this).prop('href'), '', 'scrollbars=no,menubar=no,status=no,titlebar=no,toolbar=nolocation=no,menubar=no,resizable=noe,height=' + windowHeight + ',width=' + windowWidth + ',top=' + positionWindowTop + ', left=' + positionWindowLeft); 

     // If the default windows is focused 
     if (window.focus) { 
      // Change the focus to the the popup window 
      popupWindow.focus(); 
     } 

     return false; 
    }); 
});