Hay pestañas en la página cuando hace clic en el contenido que se abre. Las pestañas se hicieron en Bootstrap5 (esto es lo que quería el cliente). Pero el problema es que las pestañas están en diferentes lugares.
Algunos en el encabezado, otros en el principal y sus ventanas deben abrirse en el medio de la página, y para que los de arriba no interfieran con los de abajo, debe hacer clic en los de arriba para que la clase en la parte inferior unos se elimina y viceversa.
TypeError no capturado: no se pueden leer las propiedades de undefined (leyendo 'classList') en HTMLAnchorElement. (archivo:///C:/Desktop/webLocale(aplicación)/script.js:70:25)
Aparece solo cuando tabulado en el elemento con la clase ".nav-link"
const linkItem = document.querySelectorAll('.nav-item__link'), navLink = document.querySelectorAll('.nav-link'), tab = document.querySelectorAll('.tab-pane'); for (let i = 0; i < linkItem.length; i++) { linkItem[i].addEventListener('click', function(e) { e.preventDefault(); for (let x = 0; x < linkItem.length; x++) { linkItem[x].classList.remove('active') navLink[x].classList.remove('active') } linkItem[i].classList.add('active') }) } for (let a = 0; a < navLink.length; a++) { navLink[a].addEventListener('click', function(e) { e.preventDefault(); for (let j = 0; j < navLink.length; j++) { linkItem[j].classList.remove('active') // error belong to this string } navLink[a].classList.add('active') }) }En la línea 4-6, recorre navLink usando una variable llamada j y luego, en la línea 5, selecciona el elemento j de linkItem ; probablemente debería ser navLink .
1. for (let a = 0; a < navLink.length; a++) { 2. navLink[a].addEventListener('click', function(e) { 3. e.preventDefault(); 4. for (let j = 0; j < navLink.length; j++) { 5. linkItem[j].classList.remove('active') // error belong to this string 6. } 7. navLink[a].classList.add('active') 8. }) 9. }Esta podría ser una alternativa a los lugares donde elimina los nombres de clase en lugar de usar un bucle for y confundirse:
navLink.forEach(link => link.classList.remove('active')); Y en lugar de navLink[a].classList.add('active') en la línea 7, escriba:
e.target.classList.add('active');