JavaScript | Comprobar si una string de URL es absoluta o relativa

La tarea es verificar si la URL pasada es absoluta o relativa. A continuación se presentan algunos enfoques:
Enfoque 1:

Use la expresión regular que verifica si la URL contiene «//» en una posición en la URL.

Ejemplo 1: Este ejemplo utiliza el enfoque discutido anteriormente.

<!DOCTYPE HTML>
<html>
  
<head>
    <title>
        Test if a URL string is absolute or relative?
    </title>
    <script src=
"https://ajax.googleapis.com/ajax/libs/jquery/3.4.1/jquery.min.js">
    </script>
</head>
  
<body style="text-align:center;">
    <h1 style="color: green">  
            GeeksForGeeks  
        </h1>
    <p id="GFG_UP"
       style="font-size: 20px; 
              font-weight: bold;">
    </p>
    <button onclick="gfg_Run()">
        Click Here
    </button>
    <p id="GFG_DOWN" 
       style="color:green; font-size: 26px; 
              font-weight: bold;">
    </p>
    <script>
        var el_up = document.getElementById("GFG_UP");
        var el_down = document.getElementById("GFG_DOWN");
        var URL = "https://geeksforgeeks.org";
        el_up.innerHTML =
"Click on the button to check if the URL is relative or"+
          " Absolute.<br>URL = '" + URL + "'";
  
        function gfg_Run() {
            var RgExp = new RegExp('^(?:[a-z]+:)?//', 'i');
            if (RgExp.test(URL)) {
                el_down.innerHTML = "This is Absolute URL.";
            } else {
                el_down.innerHTML = "This is Relative URL.";
            }
        }
    </script>
</body>
  
</html>

Producción:

Antes de hacer clic en el botón:
Después de hacer clic en el botón:

Enfoque 2:

Utilice el método .indexOf() para saber si la posición de «://» tiene un índice mayor que 0 o la posición de «//» tiene un índice igual a 0. La verificación de ambas condiciones nos lleva a la URL absoluta.

Ejemplo 2: Este ejemplo utiliza el enfoque discutido anteriormente.

<!DOCTYPE HTML>
<html>
  
<head>
    <title>
        Test if a URL string is absolute or relative?
    </title>
    <script src=
"https://ajax.googleapis.com/ajax/libs/jquery/3.4.1/jquery.min.js">
    </script>
</head>
  
<body style="text-align:center;">
    <h1 style="color: green">  
            GeeksForGeeks  
        </h1>
    <p id="GFG_UP"
       style="font-size: 20px; font-weight: bold;">
    </p>
    <button onclick="gfg_Run()">
        Click Here
    </button>
    <p id="GFG_DOWN" 
       style="color:green; 
              font-size: 26px; 
              font-weight: bold;">
    </p>
    <script>
        var el_up = document.getElementById("GFG_UP");
        var el_down = document.getElementById("GFG_DOWN");
        var URL = "/myfolder/test.txt";
        el_up.innerHTML = 
"Click on the button to check if the URL is"+
          " relative or Absolute.<br>URL = '" + URL + "'";
  
        function gfg_Run() {
            if (URL.indexOf('://') > 0 || URL.indexOf('//') === 0) {
                el_down.innerHTML = "This is Absolute URL.";
            } else {
                el_down.innerHTML = "This is Relative URL.";
            }
        }
    </script>
</body>
  
</html>

Producción:

Antes de hacer clic en el botón:
Después de hacer clic en el botó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 Cancelar la respuesta