0

alguno me podria decir por que no me resalta lo marcado ?

$(document).ready(function(){
    //$("a[href^='http://']").addClass("linkdestacacursos");
    document.getElementById("cursos").addEventListener("click, resaltacursos, false");

});
function resaltacursos(){
    $(".cursos").addClass("linkdestacacursos");
}

EL CODIGO COMPLETO:

<!doctype html>
<html>
<head>
<meta charset="utf-8">
<title>Documento sin título</title>
<style>

.linkdestacacursos{
    background-color:#F00;

}

a{
    display:block;
    margin-bottom:20px;
    font-size:24px;
}
table{
    text-align:center;
    border:none;
}

td{
    border:none;
}

#contieneEnlaces {
    position: absolute;
    left: 31px;
    top: 65px;
    width: 400px;
    height: 649px;
    z-index: 1;
    padding-top:100px;
}
</style>

<script
  src="http://code.jquery.com/ui/1.11.4/jquery-ui.js"
  integrity="sha256-DI6NdAhhFRnO2k51mumYeDShet3I8AKCQf/tf7ARNhI="
  crossorigin="anonymous"></script>
  <script>
    $(document).ready(function(){
        //$("a[href^='http://']").addClass("linkdestacacursos");
        document.getElementById("cursos").addEventListener("click, resaltacursos, false");

    });
    function resaltacursos(){
        $(".cursos").addClass("linkdestacacursos");
    }
    </script>



</head>

<body>

<div id="contieneEnlaces">

<a href="http://www.pildorasinformaticas.com" target="_blank" class="cursos">
Píldoras informáticas
</a><br>

<a href="http://www.google.com" target="_blank" class="ejemplos">
Google
</a><br>

<a href="https://www.youtube.com/user/pildorasinformaticas" target="_blank" class="cursos">
Píldoras informáticas YouTube
</a><br>

<a href="remover_reemplazar.html" target="_blank" >
Remover y reemplazar
</a><br>

<a href="https://news.google.es/" target="_blank" class="ejemplos">
Noticias google
</a><br>

<a href="calculadora_arcaica.html" target="_blank" >
Calculadora
</a>
</div>

<table width="100%" border="1">
<tr>
<td>Cursos destacados&nbsp;&nbsp;<input type="button"  value="Cursos" id="cursos"></td>
<td>Información adicional&nbsp;&nbsp;<input type="button"  value="Información" id="informacion"></td>
</tr>




</body>
</html>
4
  • me falto agregar que esto esta todo entre etiquetas <script></script>
    – lucasczuma
    el 16 mar. 2019 a las 7:50
  • He visto que tienes todo el código en la pregunta, pero no lo has marcado y por eso se ve raro. Lo he editado pero lo tienen que revisar el 16 mar. 2019 a las 9:52
  • ¿Exactamente qué deseas lograr? Puedo entender por tu pregunta que no realiza una asignación de clase. Tal vez si explicaras un poco mejor lo que te propones pudieras recibir alguna respuesta válida. Preguntar no sólo es pegar código y esperar que los demás entiendan todo del mismo. Te invito a leer ¿Cómo elaboro una buena pregunta?. Saludos el 16 mar. 2019 a las 12:58
  • Deseo lograr que se resalten los elementos < a href> al hacer un evento click en el boton cursos, y el en boton informacion
    – lucasczuma
    el 16 mar. 2019 a las 16:24

1 respuesta 1

0

Te lo muesto sin usar jQuery. Pongo el script al final del html

<!doctype html>
<html>
<head>
<meta charset="utf-8">
<title>Documento sin título</title>
<style>

.linkdestacacursos{
    background-color:#F00;

}

a{
    display:block;
    margin-bottom:20px;
    font-size:24px;
}
table{
    text-align:center;
    border:none;
}

td{
    border:none;
}

#contieneEnlaces {
    position: absolute;
    left: 31px;
    top: 65px;
    width: 400px;
    height: 649px;
    z-index: 1;
    padding-top:100px;
}
</style>





</head>

<body>

<div id="contieneEnlaces">

<a href="http://www.pildorasinformaticas.com" target="_blank" class="cursos">
Píldoras informáticas
</a><br>

<a href="http://www.google.com" target="_blank" class="ejemplos">
Google
</a><br>

<a href="https://www.youtube.com/user/pildorasinformaticas" target="_blank" class="cursos">
Píldoras informáticas YouTube
</a><br>

<a href="remover_reemplazar.html" target="_blank" >
Remover y reemplazar
</a><br>

<a href="https://news.google.es/" target="_blank" class="ejemplos">
Noticias google
</a><br>

<a href="calculadora_arcaica.html" target="_blank" >
Calculadora
</a>
</div>

<table width="100%" border="1">
<tr>
<td>Cursos destacados&nbsp;&nbsp;<input type="button"  value="Cursos" id="cursos"></td>
<td>Información adicional&nbsp;&nbsp;<input type="button"  value="Información" id="informacion"></td>
</tr>



<script src="http://code.jquery.com/ui/1.11.4/jquery-ui.js" integrity="sha256-DI6NdAhhFRnO2k51mumYeDShet3I8AKCQf/tf7ARNhI=" crossorigin="anonymous"></script><script>
document.addEventListener('click', function(e){
    if(e.target.classList.contains('curso')){
        if(e.target.classList.contains('linkdestacacursos')){
            e.target.classList.add('linkdestacacursos');
        }else{
            e.target.classList.remove('linkdestacacursos');
        }
    }
});

    </script>
</body>
</html>

Tu Respuesta

By clicking “Publica tu respuesta”, you agree to our terms of service and acknowledge you have read our privacy policy.

¿No es la respuesta que buscas? Examina otras preguntas con la etiqueta o formula tu propia pregunta.