所以我在SVG中有很多元素，比方说30，它们都有相应的类，例如.el01, .el02, .el03 ......最多.el30。
我需要为每个人制作一个变量，以便按照想要的顺序使用它，但是编写类似的内容会非常繁琐：
var el01 = $(".el01"),
el02 = $(".el02"),
...
el30 = $(".el30");
有没有办法减少代码量并通过某种循环键入这里，但是仍然可以使用所有想要的变量？
答案 0 :(得分：5)
您可以使用数组：
const eles = Array.from(
{ length: 30},
(_, i) => $(`.el${String(i + 1).padStart(2, '0')}`)
);
请注意，数组是零索引的 - 例如eles[0]是$(".el01")。此外，padStart有点新，所以如果在互联网上服务，请加入polyfill。
答案 1 :(得分：2)
如果所需的元素都是相同类型，则可以使用JQuery .toArray()方法：
var elements = $( 'div' ).toArray();
然后你可以使用这个数组：
$( elements[ 0 ] );
$( element ).eq( 0 );
示例：
function changeColor () {
var elements = $( 'path' ).toArray();
$( elements[ 0 ] ).css( 'fill', 'red' );
$( elements ).eq( 1 ).css( 'fill', 'blue' )
}<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<button type="button" onclick="changeColor()">Change Color</button>
<br>
<svg version="1.1" id="Capa_1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" x="0px" y="0px"
viewBox="0 0 512 512" style="enable-background:new 0 0 512 512; width: 128px" xml:space="preserve">
<path style="fill:#4BB9F5;" d="M277.893,261.368h132.962c50.338,0,91.145,40.807,91.145,91.145V475H277.893V261.368z"/>
<path style="fill:#F5C86E;" d="M250.441,273.139V137.743C250.441,82.104,205.336,37,149.697,37l0,0
C94.058,37,48.954,82.104,48.954,137.743v136.243L250.441,273.139z"/>
<path style="fill:#FF8C8C;" d="M234.77,261.368H101.809c-50.338,0-91.145,40.807-91.145,91.145V475H234.77"/>
<path style="fill:#A5DC69;" d="M348.536,475v-87.749c0-29.506-20.305-54.265-47.702-61.078l-22.941-4.688l-43.783-0.196
l-22.944,4.884c-27.398,6.813-47.702,31.572-47.702,61.078V475H348.536z"/>
<g>
<path style="fill:#FFCDAC;" d="M76.077,155.937v31.431c0,40.869,33.131,74,74,74l0,0l0,0c40.869,0,74-33.131,74-74v-31.431
L177,137.5L76.077,155.937z"/>
<path style="fill:#FFCDAC;" d="M256,206.041c-29.966,0-54.258,24.292-54.258,54.258v11.225c0,29.918,24.292,54.172,54.258,54.172
l0,0c29.966,0,54.258-24.254,54.258-54.172v-11.225C310.258,230.333,285.966,206.041,256,206.041L256,206.041z"/>
</g>
<path style="fill:#FF9155;" d="M256,206.041L256,206.041c-26.91,0-49.232,19.595-53.508,45.293h41.107
c8.712,0,16.857-4.026,22.151-10.775l-3.641,5.329l20.112,5.446h27.286C305.232,225.636,282.91,206.041,256,206.041z
M267.839,237.501l0.001-0.001l0,0L267.839,237.501z"/>
<path style="fill:#FFCDAC;" d="M435.923,133v54.368c0,40.869-33.131,74-74,74l0,0l0,0c-40.869,0-74-33.131-74-74V133H435.923z"/>
<path style="fill:#BEBEBE;" d="M361.923,64.123L361.923,64.123c-40.869,0-74,33.131-74,74v17.814h36.181
c24.051,0,46.868-10.649,62.316-29.083l0,0l49.503,29.083v-17.814C435.923,97.254,402.793,64.123,361.923,64.123z"/>
<g>
<polyline style="fill:#FFB487;" points="318.656,265.869 361.932,335.071 405.191,265.869 "/>
<polyline style="fill:#FFB487;" points="106.43,265.869 149.706,335.071 192.964,265.869 "/>
</g>
<path d="M64,371.71c2.63,0,5.21-1.07,7.069-2.94c1.861-1.86,2.931-4.44,2.931-7.06c0-2.63-1.07-5.21-2.931-7.08
c-1.859-1.86-4.439-2.92-7.069-2.92s-5.21,1.06-7.07,2.92S54,359.069,54,361.71c0,2.63,1.069,5.2,2.93,7.06
C58.79,370.64,61.37,371.71,64,371.71z"/>
<path d="M469.615,296.551c1.966,2.063,4.602,3.102,7.242,3.102c2.478,0,4.96-0.916,6.896-2.76c3.998-3.81,4.151-10.14,0.342-14.139
l-0.716-0.743c-3.845-3.965-10.177-4.063-14.141-0.217c-3.965,3.845-4.062,10.176-0.217,14.141L469.615,296.551z"/>
<path d="M505.89,317.818c-1.895-5.188-7.635-7.857-12.823-5.964c-5.188,1.895-7.858,7.636-5.964,12.823
c3.25,8.899,4.897,18.265,4.897,27.835V465h-34V361.705c0-5.522-4.478-10-10-10s-10,4.478-10,10V465h-79.464v-77.749
c0-33.581-22.735-62.688-55.289-70.781c-0.137-0.034-0.273-0.065-0.411-0.094l-0.786-0.161c8.261-8.487,14.198-19.236,16.772-31.222
l34.632,55.38c1.828,2.923,5.032,4.698,8.479,4.698s6.651-1.776,8.479-4.699l43.097-68.946c8.763,0.281,17.332,1.934,25.502,4.957
c1.145,0.423,2.316,0.624,3.469,0.624c4.065,0,7.887-2.498,9.38-6.533c1.916-5.181-0.729-10.933-5.909-12.849
c-9.599-3.551-19.628-5.592-29.877-6.112c18.239-15.421,29.85-38.448,29.85-64.146v-31.431v-17.814V133
c0-0.933-0.137-1.832-0.376-2.688c-3.955-42.668-39.941-76.189-83.624-76.189h-0.001c-43.683,0-79.668,33.521-83.623,76.189
c-0.239,0.856-0.376,1.755-0.376,2.688v5.123v17.814v31.431c0,4.391,0.342,8.702,0.994,12.913
c-5.805-2.224-12.01-3.625-18.478-4.069v-58.468C260.44,76.679,210.762,27,149.697,27S38.953,76.679,38.953,137.744v135.059
C15.259,291.331,0,320.172,0,352.513V475c0,5.522,4.478,10,10,10h492c5.522,0,10-4.478,10-10V352.513
C512,340.595,509.944,328.922,505.89,317.818z M338.536,387.251V465h-29.229v-62c0-5.522-4.478-10-10-10s-10,4.478-10,10v62h-76v-62
c0-5.522-4.478-10-10-10s-10,4.478-10,10v62h-19.844v-77.749c0-24.319,16.423-45.404,39.957-51.333l20.106-4.281
c6.999,2.618,14.57,4.059,22.473,4.059c7.793,0,15.266-1.395,22.183-3.945l20.433,4.176
C322.132,341.867,338.536,362.943,338.536,387.251z M86.076,165.937h26.182c24.218,0,47.177-9.521,64.2-26.378l37.618,22.101v25.708
c0,35.29-28.71,64-64,64s-64-28.71-64-64C86.076,187.368,86.076,165.937,86.076,165.937z M256,216.041
c17.621,0,32.864,10.353,39.98,25.293h-12.429l-5.961-1.614c0.94-4.127-0.824-8.56-4.663-10.828
c-4.755-2.809-10.886-1.232-13.696,3.522c-3.251,5.502-9.24,8.92-15.631,8.92h-27.58C223.136,226.393,238.379,216.041,256,216.041z
M150.076,271.368L150.076,271.368C150.077,271.368,150.077,271.368,150.076,271.368c11.139,0,21.767-2.198,31.502-6.152
l-31.874,50.992l-28.041-44.84H150.076z M211.742,261.333H243.6c6.688,0,13.166-1.783,18.829-4.999l17.178,4.652
c0.853,0.231,1.731,0.349,2.614,0.349h18.037v10.19c0,24.356-19.854,44.172-44.258,44.172s-44.258-19.815-44.258-44.172
L211.742,261.333L211.742,261.333z M361.931,316.208l-32.013-51.191c9.871,4.084,20.677,6.351,32.006,6.351h28.036L361.931,316.208z
M361.923,251.368c-35.289,0-63.999-28.71-63.999-64v-21.431h26.181c24.218,0,47.177-9.521,64.2-26.378l37.619,22.101v25.708
C425.924,222.658,397.213,251.368,361.923,251.368z M361.924,74.123c35.29,0,64,28.71,64,64v0.341l-34.438-20.232
c-4.211-2.475-9.593-1.544-12.73,2.199c-13.583,16.209-33.502,25.506-54.65,25.506h-26.181v-7.814
C297.924,102.833,326.634,74.123,361.924,74.123z M58.953,137.744C58.953,87.708,99.661,47,149.697,47s90.743,40.708,90.743,90.744
v60.212c-2.515,0.628-4.969,1.409-7.358,2.325c0.652-4.21,0.994-8.522,0.994-12.913v-31.431c0-3.497-1.92-6.851-4.935-8.622
l-49.503-29.083c-4.211-2.474-9.592-1.544-12.73,2.199c-13.583,16.209-33.502,25.506-54.65,25.506H76.076c-5.522,0-10,4.477-10,10
v31.431c0,25.692,11.606,48.714,29.837,64.135c-13.133,0.672-25.609,3.866-36.96,9.098
C58.953,260.601,58.953,137.744,58.953,137.744z M98.123,271.445l43.104,68.928c1.828,2.923,5.032,4.698,8.479,4.698
s6.651-1.776,8.479-4.699l34.891-55.818c2.522,12.161,8.509,23.064,16.868,31.655l-0.86,0.183c-0.111,0.024-0.222,0.05-0.331,0.077
c-32.554,8.094-55.289,37.2-55.289,70.781V465H74v-59.333c0-5.522-4.478-10-10-10s-10,4.478-10,10V465H20V352.513
C20,308.783,54.776,273.042,98.123,271.445z"/>
<path d="M337.16,175.83c-1.86-1.86-4.44-2.93-7.07-2.93c-2.64,0-5.21,1.07-7.07,2.93c-1.87,1.86-2.93,4.44-2.93,7.07
c0,2.64,1.06,5.21,2.93,7.07c1.86,1.87,4.431,2.93,7.07,2.93c2.63,0,5.21-1.06,7.07-2.93c1.859-1.86,2.93-4.43,2.93-7.07
C340.09,180.27,339.02,177.69,337.16,175.83z"/>
<path d="M393.76,172.9c-2.63,0-5.21,1.07-7.07,2.93c-1.859,1.86-2.93,4.44-2.93,7.07c0,2.64,1.07,5.21,2.93,7.07
c1.86,1.87,4.44,2.93,7.07,2.93s5.21-1.06,7.07-2.93c1.859-1.86,2.93-4.44,2.93-7.07s-1.07-5.21-2.93-7.07
C398.97,173.97,396.39,172.9,393.76,172.9z"/>
<path d="M366.544,207.885c-2.629,2.63-6.908,2.63-9.537,0c-3.906-3.905-10.236-3.905-14.143,0c-3.905,3.905-3.905,10.237,0,14.143
c5.214,5.213,12.063,7.82,18.911,7.82s13.697-2.607,18.911-7.82c3.905-3.905,3.905-10.237,0-14.143
C376.78,203.98,370.45,203.98,366.544,207.885z"/>
<path d="M118.24,192.9c2.63,0,5.21-1.06,7.069-2.93c1.86-1.86,2.931-4.44,2.931-7.07s-1.07-5.21-2.931-7.07
c-1.859-1.86-4.439-2.93-7.069-2.93c-2.631,0-5.21,1.07-7.07,2.93c-1.86,1.86-2.93,4.44-2.93,7.07s1.069,5.21,2.93,7.07
C113.03,191.84,115.609,192.9,118.24,192.9z"/>
<path d="M181.91,192.9c2.64,0,5.21-1.07,7.069-2.93c1.87-1.86,2.931-4.44,2.931-7.07s-1.061-5.21-2.931-7.07
c-1.859-1.86-4.43-2.93-7.069-2.93c-2.63,0-5.21,1.07-7.07,2.93c-1.86,1.86-2.93,4.44-2.93,7.07s1.069,5.21,2.93,7.07
S179.28,192.9,181.91,192.9z"/>
<path d="M131.018,222.028c5.214,5.213,12.063,7.82,18.911,7.82s13.697-2.607,18.911-7.82c3.905-3.905,3.905-10.237,0-14.143
c-3.906-3.905-10.236-3.905-14.143,0c-2.629,2.63-6.908,2.63-9.537,0c-3.906-3.905-10.236-3.905-14.143,0
C127.112,211.791,127.112,218.123,131.018,222.028z"/>
<path d="M256,304.663c6.849,0,13.697-2.606,18.911-7.82c3.905-3.905,3.905-10.237,0-14.143c-3.906-3.904-10.236-3.904-14.143,0
c-2.629,2.631-6.908,2.631-9.537,0c-3.906-3.904-10.236-3.904-14.143,0c-3.905,3.905-3.905,10.237,0,14.143
C242.303,302.057,249.151,304.663,256,304.663z"/>
<g>
</g>
<g>
</g>
<g>
</g>
<g>
</g>
<g>
</g>
<g>
</g>
<g>
</g>
<g>
</g>
<g>
</g>
<g>
</g>
<g>
</g>
<g>
</g>
<g>
</g>
<g>
</g>
<g>
</g>
</svg>
答案 2 :(得分：1)
您可以使用选择器startsWidth ^：
选择具有指定属性的元素，其值始于给定字符串。
var els = $('[class^=el]'); // match everything starting with el. els is now an array of every element starting with el.
var el01 = $(els[0]); // use array index to access to a specific element.
当然，您应该使用更具体的选择器。例如#myContainerOfElement > svg [class^=el]之类的东西。
var els = $('[class^=el]');
var el01 = $(els[0]);
els.css("color","blue");
el01.css("color","green");<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<div id="myContainer">
<span class="el01">1</span>
<span class="el02">2</span>
<span class="el03">3</span>
<span class="el04">4</span>
<span class="el05">5</span>
<span class="el06">6</span>
<span class="el07">7</span>
<span class="el08">8</span>
<span class="something else">9</span>
</div>
此时，如果可以，可以通过删除第n个数字重构您的课程，然后执行var els = $('.el'); var el01 = $(els[0]);。