¿Cómo eliminar el subrayado del enlace usando JavaScript?

Dado un enlace, la tarea es eliminar el subrayado del elemento ancla con la ayuda de JavaScript. Hay dos enfoques que se analizan a continuación:

Enfoque 1: use la propiedad textDecoration de JavaScript para realizar esta operación. Se puede establecer en muchos valores pero, en este ejemplo, se ha establecido en ninguno .

  • Ejemplo:

    <!DOCTYPE HTML>
    <html>
      
    <head>
        <title>
            How to remove underline from
            link using JavaScript?
        </title>
    </head>
      
    <body style="text-align:center;">
      
        <h1 style="color:green;">
            GeeksForGeeks
        </h1>
      
        <p id="GFG_UP"></p>
      
        <a id="link" href="#">This is Link</a>
          
        <br><br>
      
        <button onclick="GFG_Fun()">
            Click Here
        </button>
          
        <p id="GFG_DOWN"></p>
      
        <script>
            var el_up = document.getElementById('GFG_UP');
            var el_down = document.getElementById('GFG_DOWN');
            el_up.innerHTML = "Click on the button to "
                            + "perform the operation";
                              
            function GFG_Fun() {
                var el = document.getElementById('link');
                el.style.textDecoration = "none";
                el_down.innerHTML = "Underline Removed";
            }
        </script>
    </body>
      
    </html>
  • Producción:

Enfoque 2: use la propiedad textDecoration de JavaScript para realizar la operación. Pero, en este ejemplo, estamos configurando el valor en line-through .

  • Ejemplo:

    <!DOCTYPE HTML>
    <html>
      
    <head>
        <title>
            How to remove underline from
            link using JavaScript?
        </title>
    </head>
      
    <body style="text-align:center;">
      
        <h1 style="color:green;">
            GeeksForGeeks
        </h1>
          
        <p id="GFG_UP"></p>
      
        <a id="link" href="#">This is Link</a>
          
        <br><br>
        <button onclick="GFG_Fun()">
            Click Here
        </button>
          
        <p id="GFG_DOWN"></p>
      
        <script>
            var el_up = document.getElementById('GFG_UP');
            var el_down = document.getElementById('GFG_DOWN');
            el_up.innerHTML = "Click on the button to "
                            + "perform the operation";
                              
            function GFG_Fun() {
                var el = document.getElementById('link');
                el.style.textDecoration = "line-through";
                el_down.innerHTML = "Underline Removed";
            }
        </script>
    </body>
      
    </html>
  • Producción:

Publicación traducida automáticamente

Artículo escrito por PranchalKatiyar y traducido por Barcelona Geeks. The original can be accessed here. Licence: CCBY-SA

Deja una respuesta

Tu dirección de correo electrónico no será publicada. Los campos obligatorios están marcados con *