Не выдергивается первый символ из выражения getAttribute('href')

[Heny]

Добрый вечер, гуру)))
Я новичок в этом языке, но старательно пытаюсь изучить.
Возникла проблема, и я ничего не могу найти, подскажите плиз.

Есть такая строчка:

document.querySelector(this.getAttribute('href')).classList.add('active');

Она находит элемент с href, и элементу, у которого такой же id добавляет класс 'active'.
Это работает, но я хочу немного изменить. Надо чтобы находился href, к значению этого href добавлялись символы 'sm', и уже элементам с id=sm+href добавлялся класс 'active'.
И все тут я села)))
Пишу:

document.querySelector('sm'+this.getAttribute('href')).classList.add('active');

И ничего не получается, вернее получается, что нет такого элемента 'sm#значениеhref', и это понятно. Получается мне надо удалить символ # из значения href. Пробовала через str, через регулярные выражения, но не получается. Подскажите, ткните носом, буду очень благодарна.

[laimas]

'sm'+this.hash.substr(1)

[Vlasenko Fedor]

alert('sm' + '#you_id'.slice(1));

[Heny]

Спасибо большое.
А вот теперь вылезла ошибка:
Uncaught TypeError: Cannot read property 'classList' of null



Можно я приложу весь свой малюсенький код? может подскажете откуда эта ошибка(

<script type="text/javascript">
	    var btn = document.querySelectorAll('.btn'),
		el = document.querySelectorAll('.el');
		   Array.prototype.forEach.call(btn, function(curr){
			   curr.addEventListener('click', function() {
				   
				   Array.prototype.forEach.call(el, function(curr){
					   curr.classList.remove('active');
				});
			document.querySelector('sm'+(this.getAttribute('href').slice(1))).classList.add('active');
        return false;        
    }, false);    
}); 
</script>

[рони]

Heny,
как выглядит тег sm? может так '#cm'+... если это id

[Heny]

Выглядит так:
Тут располагаются картинки со стилем el, у которого display: none;

<div id="sm1013" class="el"><img src="/konf3d/sm1013.png" /></div>
      <div id="sm1015" class="el"><img src="/konf3d/sm1015.png" /></div>
      <div id="sm1019" class="el"><img src="/konf3d/sm1019.png" /></div>

А тут располагаются типа кнопочки, при нажатии на которые к стилю el добавляется active, и display становится block:

<div class="panel2">
          <a class="btn" href="#1013"><img src="/konf3d/1013.png"></a>
          <a class="btn" href="#1015"><img src="/konf3d/1015.png"></a>
          <a class="btn"href="#1019"><img src="/konf3d/1019.png"></a>
        </div>

Смысл в том, что потом будет блок с приставкой 'sp' и другие, а кнопочки с href="" останутся теми же самыми

[Heny]

Heny,
как выглядит тег sm? может так '#cm'+... если это id

Спасибо, добрый человек!!!
Помогло так:

document.querySelector('#sm'+this.getAttribute('href').slice(1)).classList.add('active');

Надо же как просто оказалось!!!!

[Heny]

И еще маленький глупенький вопросик. Как сделать так, чтобы при нажатии на

<a class="btn" href="#1013"><img src="/konf3d/1013.png"></a>

, страница не прокручивалась до самой ссылки-кнопки? Так как

<div id="sm1013" class="el"><img src="/konf3d/sm1013.png" /></div>

с которым происходят изменения находится выше

[рони]

Heny,
отменить переход по ссылке
curr.addEventListener('click', function(event) {event.preventDefault();

[laimas]

<a class="btn" href="#1015"><img src="/konf3d/1015.png"></a>

Ну так сразу и укажите якоря как href="#sm1015", тогда обратиться к id соответствующему будет проще document.querySelector(this.hash)