|
Не выдергивается первый символ из выражения getAttribute('href')
Добрый вечер, гуру))) :)
Я новичок в этом языке, но старательно пытаюсь изучить. Возникла проблема, и я ничего не могу найти, подскажите плиз. Есть такая строчка: 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, через регулярные выражения, но не получается. Подскажите, ткните носом, буду очень благодарна. |
'sm'+this.hash.substr(1)
|
alert('sm' + '#you_id'.slice(1)); |
Спасибо большое.
А вот теперь вылезла ошибка: Uncaught TypeError: Cannot read property 'classList' of null :blink: Можно я приложу весь свой малюсенький код? может подскажете откуда эта ошибка( <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 |
Выглядит так:
Тут располагаются картинки со стилем 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="" останутся теми же самыми |
Цитата:
Помогло так: document.querySelector('#sm'+this.getAttribute('href').slice(1)).classList.add('active'); Надо же как просто оказалось!!!! |
И еще маленький глупенький вопросик. Как сделать так, чтобы при нажатии на
<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(); |
Цитата:
|
Часовой пояс GMT +3, время: 19:00. |
|