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

Ваш ответ

Нажимая на кнопку «Отправить ответ», вы соглашаетесь с нашими условиями использования и подтверждаете, что прочитали и поняли наши политику конфиденциальности и нормы поведения.

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