对数组的所有 aria-label 元素进行子串化

Posted 2023-05-08

【中文标题】对数组的所有 aria-label 元素进行子串化

【英文标题】：Substring all aria-label elements of an array

【发布时间】：2022-01-01 05:15:35

【问题描述】：

html

<div role="group" class="swiper-slide w-dyn-item" aria-label="1 / 13" 
<div role="group" class="swiper-slide w-dyn-item" aria-label="2 / 13" 
<div role="group" class="swiper-slide w-dyn-item swiper-slide-prev" aria-label="3 / 13" 
<div role="group" class="swiper-slide w-dyn-item swiper-slide-active" aria-label="4 / 13" 
<div role="group" class="swiper-slide w-dyn-item swiper-slide-next" aria-label="5 / 13" 
<div role="group" class="swiper-slide w-dyn-item" aria-label="6 / 13" 

在这里，我有一个 JS 脚本，用于获取变量结果中的活动幻灯片的编号。为了得到它，我从活动幻灯片的“aria-label”（仅保留“/13”之前的幻灯片编号）中获取子字符串信息：

   var activeslide = $('.swiper-slide-active').attr('aria-label');
    activeslide = activeslide.substring(0, activeslide.indexOf(" "))  
    var numactiveslide = parseInt(activeslide);
    numactiveslide = numactiveslide - 1;
    players[(numactiveslide)].play();

结果 // numactiveslide: "4"

**如何获得相同的不是 1 个而是 3 个特殊幻灯片（上一个、活动、下一个）。 我尝试获得相同的效果，为一组新的 3 张活动幻灯片（swiper-slide-prev、swiper-slide-active 和 swiper-slide-next）工作。

这是所选幻灯片的 var：

 var **activeslides** = $('.swiper-slide-prev,.swiper-slide-active,.swiper-slide-next');

预期结果是 3 张活动幻灯片编号： // numactiveslides = 3,4,5

如何通过编写 loop 或 forEach 或类似的东西来使代码工作？这应该很容易，但我没有设法为每个元素重复子字符串，最后得到一个数组：

numactivesslides (3):
        numactivesslides[0] = 3
        numactivesslides[1] = 4
        numactivesslides[2] = 5

【问题讨论】：

很难理解你的问题。

如果您观看 html 部分，我试图在一个数组中获取 3 个数字，每个数字都可以在 aria 标签中找到，而没有每个特殊“活动”幻灯片的“/13”（类名为 swiper-slide -prev、swiper-slide-active 和 swiper-slide-next) - 所以在这个例子中，我要求代码在变量数组中获取“3,4,5”。

【参考方案1】：

好的，我终于找到了答案。它工作正常。

    var activeslides;
    var activslidesnumber = [];
    var activplyrs = [];
    var activslidlength;
    
    setTimeout(function()
    activeslides = $('.swiper-slide-prev,.swiper-slide-active,.swiper-slide-next');
    console.log("actives slides:",activeslides);
    activslidlength = activeslides.length;
    console.log('activslidlength ',activslidlength);
    var arialabel;
    for (let n = 0; n < activslidlength; n ++)   
    //get numbers
    arialabel = activeslides[n].getAttribute('aria-label');
    //update to keep only first num before space
    arialabel = arialabel.substring(0, arialabel.indexOf(" "));
    arialabel = parseInt(arialabel);
    // put each arialabels on this var list
    activslidesnumber.push(arialabel);
    // fit fist slide to first player
    activplyrs.push(arialabel - 1);
    ;

console.log("actives slides num:",activslidesnumber);
console.log('activplyrs ',activplyrs)

// THEN IF NEEDED, PLAY PLYR ON ACTIVE SLIDES

    if (activplyrs[2] == undefined) 
    covplayers[(activplyrs[0])].play();
    covplayers[(activplyrs[1])].play();
     else 
    covplayers[(activplyrs[0])].play();
    covplayers[(activplyrs[1])].play();
    covplayers[(activplyrs[2])].play();

, 200);

//然后用 covplayers.pause(); 对被动幻灯片做同样的事情；