БЛОГ НА HUSL


Почему скрипт js применяется только к первому id

Автор вопроса: Sirius_MkLain

id все уникальны но js применяется только к первому, почему он дальше не идет? Я в js новичек, помогите пожалуйста.

let a = moment();

         let b = moment([2016, 2, 29]);

         let years = a.diff(b, 'year');

         b.add(years, 'years');

         let months = a.diff(b, 'months');

         b.add(months, 'months');

         let days = a.diff(b, 'days');

         document.getElementById("mironov").innerHTML = years + ' год ' + months + ' десяц ' + days + ' день';
         
         let a = moment();

    let b = moment([2016, 2, 29]);

    let years = a.diff(b, 'year');

    b.add(years, 'years');

    let months = a.diff(b, 'months');

    b.add(months, 'months');

    let days = a.diff(b, 'days');

    document.getElementById("nazarenko").innerHTML = years + ' год ' + months + ' десяц ' + days + ' день';
    
      let a = moment();

    let b = moment([2019, 5, 31]);

    let years = a.diff(b, 'year');

    b.add(years, 'years');

    let months = a.diff(b, 'months');

    b.add(months, 'months');

    let days = a.diff(b, 'days');







    document.getElementById("arhipenko").innerHTML = years + ' год ' + months + ' десяц ' + days + ' день';
    
    
    
    let a = moment();
    let b = moment([2017, 11, 7]);
    let years = a.diff(b, 'year');
    b.add(years, 'years');
    let months = a.diff(b, 'months');
    b.add(months, 'months');
    let days = a.diff(b, 'days');
    document.getElementById("gusarov").innerHTML = years + ' год ' + months + ' десяц ' + days + ' день';
    
    let a = moment();

    let b = moment([2018, 8, 8]);

    let years = a.diff(b, 'year');

    b.add(years, 'years');

    let months = a.diff(b, 'months');

    b.add(months, 'months');

    let days = a.diff(b, 'days');

    document.getElementById("filatov").innerHTML = years + ' год ' + months + ' десяц ' + days + ' день';
<script src="https://cdnjs.cloudflare.com/ajax/libs/moment.js/2.29.1/moment.min.js"></script>
<!DOCTYPE html>

<html lang="en">

<head>

    <meta charset="UTF-8">

    <title>Test-date</title>

</head>

<body>

<section class="leadership-area">

    <div class="container">

        <h3 class="title">Наши специалисты</h3>



        <div class="row justify-left">

            <div class="col-lg-4 col-md-6 col-sm-9">

                <div class="leadership-item mt-30">

                    <div class="leadership-thumb">

                        <img src="assets/images/team-1.jpg" alt="">

                    </div>

                    <div class="leadership-content text-center">

                        <h4>Миронов <br> Андрей <br>Евгеньевич</h4>

                        <span>Опыт работы</span>

                        <p id="mironov"></p>

                    </div>

                </div>

            </div>

            <div class="col-lg-4 col-md-6 col-sm-9">

                <div class="leadership-item mt-30">

                    <div class="leadership-thumb">

                        <img src="assets/images/team-2.jpg" alt="">

                    </div>

                    <div class="leadership-content text-center">

                        <h4>Назаренко Дмитрий Викторович</h4>

                        <span>Опыт работы</span>

                        <p id="nazarenko"></p>

                    </div>

                </div>

            </div>

            <div class="col-lg-4 col-md-6 col-sm-9">

                <div class="leadership-item mt-30">

                    <div class="leadership-thumb">

                        <img src="assets/images/team-3.jpg" alt="">

                    </div>

                    <div class="leadership-content text-center">

                        <h4>Архипенко Владислав Владимирович</h4>

                        <span>Опыт работы</span>

                        <p id="arhipenko"></p>

                    </div>

                </div>

            </div>

            <div class="col-lg-4 col-md-6 col-sm-9">

                <div class="leadership-item mt-30">

                    <div class="leadership-thumb">

                        <img src="assets/images/team-4.jpg" alt="">

                    </div>

                    <div class="leadership-content text-center">

                        <h4>Гусаров <br>Юрий Владимирович</h4>

                        <span>Опыт работы</span>

                        <p id="gusarov"></p>

                    </div>

                </div>

            </div>

            <div class="col-lg-4 col-md-6 col-sm-9">

                <div class="leadership-item mt-30">

                    <div class="leadership-thumb">

                        <img src="assets/images/team-5.jpg" alt="">

                    </div>

                    <div class="leadership-content text-center">

                        <h4>Филатов <br>Дмитрий Андреевич</h4>

                        <span>Опыт работы</span>

                        <p id="filatov"></p>

                    </div>

                </div>

            </div>

        </div>

    </div>

</section>





</html>


Источник

Ответы (2 шт):

Автор решения: Вася Воронцов

MDN Web Docs

Повторное объявление той же переменной в том же блоке или функции приведет к выбросу исключения SyntaxError.

Вы объявляете переменные несколько раз в одном и том же блоке (let a, let b и проч.). Оставьте только первое объявление

→ Ссылка
Автор решения: Andinevsky

Если все поменять, то должно работать

let a5 = moment();

         let b5 = moment([2016, 2, 29]);

         let years5 = a5.diff(b5, 'year');

         b5.add(years5, 'years');

         let months5 = a5.diff(b5, 'months');

         b5.add(months5, 'months');

         let days5 = a5.diff(b5, 'days');

         document.getElementById("mironov").innerHTML = years5 + ' год ' + months5 + ' десяц ' + days5 + ' день';
         
         let a4 = moment();

    let b4 = moment([2016, 2, 29]);

    let years4 = a4.diff(b4, 'year');

    b4.add(years4, 'years');

    let months4 = a4.diff(b4, 'months');

    b4.add(months4, 'months');

    let days4 = a4.diff(b4, 'days');

    document.getElementById("nazarenko").innerHTML = years4 + ' год ' + months4 + ' десяц ' + days4 + ' день';
    
      let a3 = moment();

    let b3 = moment([2019, 5, 31]);

    let years3 = a3.diff(b3, 'year');

    b3.add(years3, 'years');

    let months3 = a3.diff(b3, 'months');

    b3.add(months3, 'months');

    let days3 = a3.diff(b3, 'days');







    document.getElementById("arhipenko").innerHTML = years3 + ' год ' + months3 + ' десяц ' + days3 + ' день';
    
    
    
    let a2 = moment();
    let b2 = moment([2017, 11, 7]);
    let years2 = a2.diff(b2, 'year');
    b2.add(years2, 'years');
    let months2 = a2.diff(b2, 'months');
    b2.add(months2, 'months');
    let days2 = a2.diff(b2, 'days');
    document.getElementById("gusarov").innerHTML = years2 + ' год ' + months2 + ' десяц ' + days2 + ' день';
    
    let a1 = moment();

    let b1 = moment([2018, 8, 8]);

    let years1 = a1.diff(b1, 'year');

    b1.add(years1, 'years');

    let months1 = a1.diff(b1, 'months');

    b1.add(months1, 'months');

    let days1 = a1.diff(b1, 'days');

    document.getElementById("filatov").innerHTML = years1 + ' год ' + months1 + ' десяц ' + days1 + ' день';
<script src="https://cdnjs.cloudflare.com/ajax/libs/moment.js/2.29.1/moment.min.js"></script>
<!DOCTYPE html>

<html lang="en">

<head>

    <meta charset="UTF-8">

    <title>Test-date</title>

</head>

<body>

<section class="leadership-area">

    <div class="container">

        <h3 class="title">Наши специалисты</h3>



        <div class="row justify-left">

            <div class="col-lg-4 col-md-6 col-sm-9">

                <div class="leadership-item mt-30">

                    <div class="leadership-thumb">

                        <img src="assets/images/team-1.jpg" alt="">

                    </div>

                    <div class="leadership-content text-center">

                        <h4>Миронов <br> Андрей <br>Евгеньевич</h4>

                        <span>Опыт работы</span>

                        <p id="mironov"></p>

                    </div>

                </div>

            </div>

            <div class="col-lg-4 col-md-6 col-sm-9">

                <div class="leadership-item mt-30">

                    <div class="leadership-thumb">

                        <img src="assets/images/team-2.jpg" alt="">

                    </div>

                    <div class="leadership-content text-center">

                        <h4>Назаренко Дмитрий Викторович</h4>

                        <span>Опыт работы</span>

                        <p id="nazarenko"></p>

                    </div>

                </div>

            </div>

            <div class="col-lg-4 col-md-6 col-sm-9">

                <div class="leadership-item mt-30">

                    <div class="leadership-thumb">

                        <img src="assets/images/team-3.jpg" alt="">

                    </div>

                    <div class="leadership-content text-center">

                        <h4>Архипенко Владислав Владимирович</h4>

                        <span>Опыт работы</span>

                        <p id="arhipenko"></p>

                    </div>

                </div>

            </div>

            <div class="col-lg-4 col-md-6 col-sm-9">

                <div class="leadership-item mt-30">

                    <div class="leadership-thumb">

                        <img src="assets/images/team-4.jpg" alt="">

                    </div>

                    <div class="leadership-content text-center">

                        <h4>Гусаров <br>Юрий Владимирович</h4>

                        <span>Опыт работы</span>

                        <p id="gusarov"></p>

                    </div>

                </div>

            </div>

            <div class="col-lg-4 col-md-6 col-sm-9">

                <div class="leadership-item mt-30">

                    <div class="leadership-thumb">

                        <img src="assets/images/team-5.jpg" alt="">

                    </div>

                    <div class="leadership-content text-center">

                        <h4>Филатов <br>Дмитрий Андреевич</h4>

                        <span>Опыт работы</span>

                        <p id="filatov"></p>

                    </div>

                </div>

            </div>

        </div>

    </div>

</section>





</html>

→ Ссылка

licensed under cc by-sa 3.0 with attribution.