使用<a>或<span>在单个页面上显示/隐藏元素

我根据单击的内容使用jQuery在单个页面上显示或隐藏divs元素：

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>选项会被认为是不良的编码风格吗？