2

Как сделать так чтобы сразу двум элементам с помощью getElementById сработала функция скрытия текста?

var length = 10;

var text = document.getElementById('subscription_desc')// как сюда добавить второй элемент?

var string = text.innerHTML
var trimmedString = string.length > length ?
  string.substring(0, length - 3) + "..." :
  string

text.innerHTML = trimmedString
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<ul>
    <h6 style="margin:0;">Ваши подписки</h6>
    <li>

        <a href="#">
            
            <div class="channel_info">
                <h6 class="channel_title" id="subscription_desc">Секрет фирмы</h6>
                <h6 class="channel_desc" id="subscription_subtitle_desс">Оставайтесь рисковать</h6>
            </div>
        </a>
    </li>
    <li>
        
        <a href="#">

            <div class="channel_info">
                <h6 class="channel_title" id="subscription_desc" id="subscription_desc">Медуза</h6>
                <h6 class="channel_desc" id="subscription_subtitle_desc">Но есть и хорошие новости</h6>
            </div>
        </a>
    </li>
    <li>
        
        <a href="#">

            <div class="channel_info">
                <h6 class="channel_title" id="subscription_desc">Яндекс</h6>
                <h6 class="channel_desc" id="subscription_subtitle_desc">Найдется все</h6>
            </div>
        </a>
    </li>
    <li>
        
        <a href="#">

            <div class="channel_info">
                <h6 class="channel_title" id="subscription_desc">Spark</h6>
                <h6 class="channel_desc" id="subscription_subtitle_desc">Сообщество предпринимателей</h6>
            </div>
        </a>
    </li>
    <li>
       
        <a href="#">

            <div class="channel_info">
                <h6 class="channel_title" id="subscription_desc">BOOM</h6>
                <h6 class="channel_desc" id="subscription_subtitle_desc">Твоя музыка у нас!</h6>
            </div>
        </a>
    </li>
</ul>

1
  • 2
    Как с помощью getElementById выбрать сразу несколько элементов? - никак 9 дек 2017 в 6:59

1 ответ 1

5

Не смотря на то, что хоть и через пятую точку, но можно вытащить элементы с одинаковым id (НО НЕ С ПОМОЩЬЮ getElementById) cамый правильный вариант использовать class для одинаковых групп. и использовать getElementsByClassName или querySelectorAll (для Jquery: $('.MY_CLASS_NAME'))


идеалогически НЕПРАВИЛЬНЫЙ вариант, но рабочий:

var length = 10;

var text = document.querySelectorAll('h6[id="subscription_desc"]')// как сюда добавить второй элемент?

for (var i = 0; i < text.length; ++i) {
  text[i].innerHTML = 'Секрет фирмы ' +  (++i);
}
<ul>
    <h6 style="margin:0;">Ваши подписки</h6>
    <li>

        <a href="#">
            
            <div class="channel_info">
                <h6 class="channel_title" id="subscription_desc">Секрет фирмы</h6>
                <h6 class="channel_desc" id="subscription_subtitle_desс">Оставайтесь рисковать</h6>
            </div>
        </a>
    </li>
    <li>
        
        <a href="#">

            <div class="channel_info">
                <h6 class="channel_title" id="subscription_desc" id="subscription_desc">Медуза</h6>
                <h6 class="channel_desc" id="subscription_subtitle_desc">Но есть и хорошие новости</h6>
            </div>
        </a>
    </li>
    <li>
        
        <a href="#">

            <div class="channel_info">
                <h6 class="channel_title" id="subscription_desc">Яндекс</h6>
                <h6 class="channel_desc" id="subscription_subtitle_desc">Найдется все</h6>
            </div>
        </a>
    </li>
    <li>
        
        <a href="#">

            <div class="channel_info">
                <h6 class="channel_title" id="subscription_desc">Spark</h6>
                <h6 class="channel_desc" id="subscription_subtitle_desc">Сообщество предпринимателей</h6>
            </div>
        </a>
    </li>
    <li>
       
        <a href="#">

            <div class="channel_info">
                <h6 class="channel_title" id="subscription_desc">BOOM</h6>
                <h6 class="channel_desc" id="subscription_subtitle_desc">Твоя музыка у нас!</h6>
            </div>
        </a>
    </li>
</ul>

1
  • Спасибо за внимание! Помогло
    – Bekzod
    9 дек 2017 в 7:21

Ваш ответ

By clicking “Отправить ответ”, you agree to our terms of service and acknowledge that you have read and understand our privacy policy and code of conduct.

Всё ещё ищете ответ? Посмотрите другие вопросы с метками или задайте свой вопрос.