Показать/скрыть элементы на одной странице с помощью <a> или <span>

Question

я показывать или скрывать дивы элементы на одной странице с помощью JQuery в зависимости от того, что нажата:

HTML:

<div id='aboutPage' class='visible'> 
//content 
</div> 

<div id='contactPage' class='invis'> 
//content 
</div> 

CSS:

.visible { display: block; } 
.invis { display: none; } 

JS:

$('#element1').on('click', {clickedTab: 'aboutTab'}, changeTab); 
$('#element2').on('click', {clickedTab: 'contactTab'}, changeTab); 

var currentTab = 'about'; 

function changeTab(event) 
{ 
//if-else ladder to make invis the prior current tab 
if (currentTab == 'about') 
    if (event.data.clickedTab != 'aboutTab') 
     $('#aboutPage').removeClass('visible').addClass('invis'); 
    else return; 
else if (currentTab == 'contact') 
    if (event.data.clickedTab != 'contactTab') 
     $('#contactPage').removeClass('visible').addClass('invis'); 
    else return; 

//if-else ladder to change the current tab 
if (event.data.clickedTab == 'aboutTab') { 
    currentTab = 'about'; 
    $('#aboutPage').removeClass('invis').addClass('visible'); 
} 
else if (event.data.clickedTab == 'contactTab') { 
    currentTab = 'contact'; 
    $('#contactPage').removeClass('invis').addClass('visible'); 
} 

Мой вопрос в том, подходит ли element1 и element2 к <a> элементам, даже если они технически не связаны с другой страницей? Я хотел бы сделать это, чтобы стилистически элементы отображались как ссылки на пользователя. Или, должен ли я сделать их <span> элементов, а затем просто стилизовать их, чтобы они выглядели как ссылки с помощью CSS? Есть ли разница? Будет ли вариант <a> считаться плохим стилем кодирования?

Answer 1

Мой вопрос, он подходит для element1 и element2 быть <a> элементы, даже если они не технически ссылки на другую страницу?

Нет необходимости связывать элемент привязки с другой страницей. Якорный элемент при использовании с атрибутом href создает ссылку. Эта связь может идти в любом месте: в пределах одной и той же странице, адрес электронной почты, другую страницу и т.д.

https://www.w3.org/TR/html5/text-level-semantics.html#the-a-element

Answer 2

экрана Читатели разбора страниц и обеспечивают содержание слышимым для слабовидящих. Одним из способов сканирования страницы с нарушением зрения является получение «списка ссылок» на странице. Если вы путешествуете между опытом (показывая и скрывая контент), имеет смысл использовать элемент BUTTON или A. Использование SPAN неоднозначно и не делает доступной сеть.

Если у другого пользователя есть инвалидность, которая запрещает использование мыши (или эквивалента) и ограничивается клавиатурной навигацией страницы, то SPAN никогда не достигнет фокуса при перемещении по странице, тогда как элемент A или BUTTON будет.

<a href="javascript:void(0);">your link</a> 

Указание вышеупомянутой HREF атрибута будет препятствовать вашей странице от прыгали, и позволить вашему Javascript обрабатывать переходы, как вы намерены.