find – devfrontend.info

[Javascript] Filtrer les éléments d’un tableau et stopper à la première occurrence qui matche

05/07/2018 / admin

ECMAScript:

Sources: JavaScript filter that stops at the first result et Array.prototype.find().

var array1 = [5, 12, 8, 130, 44];

var found = array1.find(function(element) {
  return element > 10;
});

console.log(found);
// expected output: 12

var array1 = [5, 12, 8, 130, 44];

var found = array1.find(function(element) {

return element > 10;

});

console.log(found);

// expected output: 12

Javascript:

Source: How to Search Arrays in JavaScript: Searching Arrays Using for Loops.

function findInArray(ar, val) {
    for (var i = 0,len = ar.length; i < len; i++) {
        if ( ar[i] > val ) { // first val > leftStackOuterHeight
            return i;
        }
    }
    return -1;
}

var firstMatchingElement = findInArray(output, leftStackOuterHeight);

function findInArray(ar, val) {

for (var i = 0,len = ar.length; i < len; i++) {

if ( ar[i] > val ) { // first val > leftStackOuterHeight

return i;

}

return -1;

}

var firstMatchingElement = findInArray(output, leftStackOuterHeight);

[jQuery] Parcourir le DOM à la recherche d’un élément suivant ou précédent, mais qui n’est pas nécessairement frère de l’élément de départ

13/04/2016 / admin

Source : jQuery find next/prev elements of a certain class but not necessarily siblings (EDIT 3).

Les méthodes next, prev, nextAll et prevAll sont très utiles pour parcourir le DOM à la recherche d’un ou plusieurs éléments frères d’un élément situé dans le même parent. Mais comment procéder si l’élément suivant ou précédent qu’on cherche à cibler se situe à l’extérieur de l’élément parent propre à notre élément de départ ?

Dans l’exemple suivant, je cherche à atteindre la classe .to-find-this en partant de l’ID #start-from-here.

<div><span id="start-from-here">hello</span></div>
<div><p class="to-find-this">world></p></div>

1 2	<div><span id="start-from-here">hello</span></div> <div><p class="to-find-this">world></p></div>

Cette action est rendue possible grâce aux fonctions jQuery suivantes :

$.fn.findNextAll = function( selector ){
  var that = this[ 0 ],
    selection = $( selector ).get();
  return this.pushStack(
    !that && selection || $.grep( selection, function(n){
       return that.compareDocumentPosition(n) & (1<<2);
       // if you are looking for previous elements it should be & (1<<1);
    })
  );
}
$.fn.findNext = function( selector ){
  return this.pushStack( this.findNextAll( selector ).first() );
}

$.fn.findNextAll = function( selector ){

var that = this[ 0 ],

selection = $( selector ).get();

return this.pushStack(

!that && selection || $.grep( selection, function(n){

return that.compareDocumentPosition(n) & (1<<2);

// if you are looking for previous elements it should be & (1<<1);

})

);

}

$.fn.findNext = function( selector ){

return this.pushStack( this.findNextAll( selector ).first() );

}

Je peux désormais cibler la classe .to-find-this en partant de l’ID #start-from-here avec la déclaration suivante :

$('#start-from-here').findNext('.to-find-this');

1	$('#start-from-here').findNext('.to-find-this');

[jQuery] Rendre, à partir d’un lien qu’il contient, un bloc entièrement cliquable

13/12/2012 / admin

Simulation : http://jsfiddle.net/frontenddeveloper/QG5qr/4/

jQuery(document).ready(function(){
    jQuery('.box').click(function(){
        window.location=jQuery(this).find("a").attr("href");
        return false;
    });
});

jQuery(document).ready(function(){

jQuery('.box').click(function(){

window.location=jQuery(this).find("a").attr("href");

return false;

});

[jQuery] Sélectionner l’intégralité d’une colonne de tableau

12/12/2012 / admin

Simulation : http://jsfiddle.net/frontenddeveloper/FZrp7/

jQuery(document).ready(function(){
		// on applique une classe aux colonnes sélectionnées pour les mettre en avant visuellement
		jQuery('table input').click(function (){
			var GET_COLUMN_INDEX = jQuery(this).closest('td').prevAll().length;

	        jQuery('input').closest('table').find('th:nth-child(' + (GET_COLUMN_INDEX + 1) + '), td:nth-child(' + (GET_COLUMN_INDEX + 1) + ')').toggleClass('selected');
	        //alert( ' column # ' + ( GET_COLUMN_INDEX ) );
		});
	});

jQuery(document).ready(function(){

// on applique une classe aux colonnes sélectionnées pour les mettre en avant visuellement

jQuery('table input').click(function (){

var GET_COLUMN_INDEX = jQuery(this).closest('td').prevAll().length;

jQuery('input').closest('table').find('th:nth-child(' + (GET_COLUMN_INDEX + 1) + '), td:nth-child(' + (GET_COLUMN_INDEX + 1) + ')').toggleClass('selected');

//alert( ' column # ' + ( GET_COLUMN_INDEX ) );

});

Articles récents

Catégories

Archives

Méta

Étiquette : find