Kann mir jemand erklären, was die eckigen Klammern hier in diesem jQuery Code machen?

Question

$(document).ready(function(){ 
$('#switcher-default').addClass('selected'); 
$('#switcher button').on('click', function(){ 

    var bodyClass = this.id.split('-')[1]; 

    $('body').removeClass().addClass(bodyClass); 
    $('#switcher button').removeClass('selected'); 
    $(this).addClass('selected'); 
    console.log(bodyClass); 
}); 
}); 

//////////////Html Code///////////// 

<div id="switcher" class="switcher"> 
    <h3>Style Switcher</h3> 
    <button id="switcher-default"> 
     Default 
    </button> 
    <button id="switcher-narrow"> 
     Narrow Column 
    </button> 
    <button id="switcher-large"> 
     Large Print 
    </button> 
</div> 

Dieser Code funktioniert und ich kann sehen, was es auch tut, aber die 1 in den eckigen Klammern verwirrt mich. Bedeutet es, die ID zu teilen, wo "-" verwendet wird, und den ersten Teil zu nehmen? Ich weiß es nicht wirklich? Würde die Hilfe anpreisen.

Answer 1

Es bedeutet, dass Sie die durch this.id identifizierte Zeichenfolge teilen, die zu einem Array führt. Sie verwenden den Wert mit Index 1 aus diesem Array, um die Variable bodyClass festzulegen.

Beachten Sie, dass in vielen Einstellungen, wenn Sie nicht derjenige sind, der alle Daten generiert, es unsicher sein kann, anzunehmen, dass das resultierende Array immer eine bestimmte Anzahl von Elementen hat.

Answer 2

Das Ergebnis von this.id.split('-') ist ein Array. So ruft [1] das Element am Index 1.

zu entsprechen würde:

//get array of ids 
var ids = this.id.split('-'); 
//get 1st id 
var bodyClass = ids[i]; 

Answer 3

this.id könnte 'Switcher-was' this.id.split('-') ist gleich zu [ 'Schalter', 'was immer'] this.id.split('-')[1] ist nimmt das zweite Element 'was auch immer'