¿Cómo extraer el nombre de host de la URL usando JavaScript?

Para extraer la parte del nombre de host de una URL, podemos usar el objeto de ubicación que representa información sobre la URL actual. Es el elemento del objeto ventana y un objeto del lado del cliente.

Sintaxis:

window.location.propertyname

Ejemplo 1: en este ejemplo, usaremos la propia URL, donde se ejecutará el código para extraer el nombre de host.

  • Programa:

    <!DOCTYPE html>
    <html>
      
    <head>
        <title>
            Get domain from URL
        </title>
    </head>
      
    <body>
        <h1 style="color: green"
            GeeksforGeeks 
        </h1>
          
        <b>URL is:</b
          
        <script>
            document.write(window.location.href);
        </script>
              
        <br>
        <b>hostname is:</b
          
        <script>
            document.write(window.location.hostname);
        </script>
    </body>
      
    </html>
  • Producción:

Ejemplo 2: en este ejemplo, le pediremos la URL al usuario y luego realizaremos la extracción del nombre de host en esa URL.

  • Programa:

    <!DOCTYPE html>
    <html>
      
    <head>
        <title>Extracting URL</title>
    </head>
      
    <body>
        <h1 style="color: green;">GeeksforGeeks</h1>
        <b>Extracting URL</b>
        <br><br>
        <form name="f1">
            <input type="text" name="txt" 
                   placeholder="Paste URL"/>
            <input type="button" value="click" 
                   onclick="url2()" />
        </form>
        <script>
            function url2() {
      
                var url3 = document.f1.txt.value;
      
                var j = url3.indexOf("://");
      
                var host = "";
      
                for (i = j + 3; i < url3.length; i++) {
                    if (url3.charAt(i) != '/') {
                        host = host + "" + url3.charAt(i);
                    } else {
                        break;
                    }
                }
                document.write(host);
            }
        </script>
    </body>
      
    </html>
  • Producción:

Publicación traducida automáticamente

Artículo escrito por vibhutipatel412 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 *