使用条件jQuery函数更改标签

时间:2018-11-19 18:04:51

标签: javascript jquery html web

我正在尝试使用jquery函数更改标签内容。 当我的carousel-item的{​​{1}}具有id=3类时,标签内容必须更改。我正在使用引导轮播组件。这是我的代码。

active

我要修改的标签的容器

    <!DOCTYPE html>
    <html>
    <head>
<meta charset="utf-8" />
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<title>Biópolis</title>
<meta name="viewport" content="width=device-width, initial-scale=1">
<!-- <script src="menu.js"></script> -->
<link rel="stylesheet" href="styles/main.css">
<link rel="stylesheet" href="https://stackpath.bootstrapcdn.com/bootstrap/4.1.3/css/bootstrap.min.css" integrity="sha384-MCw98/SFnGE8fJT3GXwEOngsV7Zt27NXFoaoApmYm81iuXoPkFOJwJ8ERdknLPMO" crossorigin="anonymous">
  </head>
<body>
<div class="pagina">

    <div class="outer">
        <div class="inner">
            <nav class="navbar navbar-light navbar-bot">
                <a class="navbar-brand nav-pos" href="#"> <img src="img/Logo biópolis ok calado.png"> </a>
            </nav>

网页的其他内容

            <div class="container text-center contenedor">
                <div class="centrar">
                    <label class="mayus" id="mayus">
                        Una comunidad interdisciplinaria
                    </label>
                    <label class="minus" id="minus">
                        construímos alternativas para desarrollos residenciales, urbanos y turísticos, responsables con la cultura, la naturaleza y el ser humano
                    </label>
                </div>
            </div>

这是我更改标签内容的功能

            <div class="menu d-flex justify-content-right text-right">
                <ul>
                    <li> <a href="#">biópolis</a> </li>
                    <li> <a href="#">arquitectura</a> </li>
                    <li> <a href="#">planeación</a></li>
                    <li> <a href="#">equipo</a></li>
                    <li> <a href="#">contacto</a></li>
                </ul>
            </div>

        </div>
    </div>

    <div id="carouselExampleSlidesOnly" class="carousel slide bg-image" data-ride="carousel">
        <div class="carousel-inner">
            <div class="carousel-item active" id="1">
                <img class="d-block w-100" src="img/01_aerea_home.jpg" alt="First slide">
            </div>

            <div class="carousel-item" id="2">
                <img class="d-block w-100" src="img/Links/1_Club de playa_perspectiva.jpg" alt="Second slide">
            </div>

            <div class="carousel-item" id="3">
                <img class="d-block w-100" src="img/Links/3.jpg" alt="Third slide">
            </div>

            <div class="carousel-item" id="4">
                <img class="d-block w-100" src="img/Links/4.jpg" alt="Third slide">
            </div>

            <div class="carousel-item" id="5">
                <img class="d-block w-100" src="img/Links/5.JPG" alt="Third slide">
            </div>

            <div class="carousel-item" id="6">
                <img class="d-block w-100" src="img/Links/6.jpg" alt="Third slide">
            </div>

        </div>

    </div>


</div>

<script src="https://code.jquery.com/jquery-3.3.1.slim.min.js" integrity="sha384-q8i/X+965DzO0rT7abK41JStQIAqVgRVzpbzo5smXKp4YfRvH+8abtTE1Pi6jizo" crossorigin="anonymous"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/popper.js/1.14.3/umd/popper.min.js" integrity="sha384-ZMP7rVo3mIykV+2+9J3UJ46jBk0WLaUAdn689aCwoqbBJiSnjAK/l8WvCWPIPm49" crossorigin="anonymous"></script>
<script src="https://stackpath.bootstrapcdn.com/bootstrap/4.1.3/js/bootstrap.min.js" integrity="sha384-ChfqqxuZUCnJSK3+MXmPNIyE6ZbWh2IMqE241rYiqJxyMiZ6OW/JmZQ5stwEULTy" crossorigin="anonymous"></script>

所以,我不知道如何进行更改。

0 个答案:

没有答案