me gustaría tomar una cuerda
var a = "http://example.com/aa/bb/"
y procesarlo en un objeto tal que
a.hostname == "example.com"
y
a.pathname == "/aa/bb"
freddiefujiwara
me gustaría tomar una cuerda
var a = "http://example.com/aa/bb/"
y procesarlo en un objeto tal que
a.hostname == "example.com"
y
a.pathname == "/aa/bb"
rvighne
La forma moderna:
new URL("http://example.com/aa/bb/")
Devuelve un objeto con propiedades. hostname
y pathname
junto con algunos otros.
El primer argumento es una URL relativa o absoluta; si es relativo, debe especificar el segundo argumento (la URL base). Por ejemplo, para una URL relativa a la página actual:
new URL("/aa/bb/", location)
Además de los navegadores, esta API también está disponible en Node.js desde v7, hasta require('url').URL
.
Tecnología experimental: ¡IE no admite esto! desarrollador.mozilla.org/en-US/docs/Web/API/URL/…
– cwouter
18 de marzo de 2015 a las 15:08
@cwouter: Sin embargo, funciona en Edge, que reemplaza a IE
– rvighne
24/06/2016 a las 20:35
esta es la forma de hacerlo, edge ya tiene 3 versiones encima de ie, así que no importa
– Claudiu Creanga
24 de agosto de 2016 a las 19:27
@justingordon: El URL
class es un estándar web, por lo que no es necesario que los usuarios que no sean navegadores lo implementen. Sin embargo, las versiones recientes de Nodejs proporcionan una biblioteca idéntica, require('url').URL
– rvighne
19 de mayo de 2017 a las 4:25
El hecho de que JavaScript no tenga una forma integrada de analizar URL que funcione en navegadores o servidores es bastante triste…
– Skiterm
25 de abril de 2018 a las 0:24
freddiefujiwara
var getLocation = function(href) {
var l = document.createElement("a");
l.href = href;
return l;
};
var l = getLocation("http://example.com/path");
console.debug(l.hostname)
>> "example.com"
console.debug(l.pathname)
>> "/path"
¿Estás seguro de que esta es una solución compatible con varios navegadores?
– cierre
10 de abril de 2009 a las 9:55
Cabe señalar que, si bien esto puede ayudar/responder al póster original, esta respuesta solo funcionará para las personas que trabajan con JS en un navegador, ya que depende del DOM para hacer su trabajo.
–Adam Batkin
1 de agosto de 2009 a las 22:21
Otro ejemplo de sencillez, junto a ingenio.
– Said Neamati
21 de febrero de 2012 a las 13:50
No funciona en IE si el href es relativo. l.hostname estará vacío. Si solo proporciona URL completas, esto funcionará.
– Derek Prior
6 sep 2012 a las 18:21
Incluso con URL absolutas, IE (probado en IE 11) se comporta de manera diferente a Chrome y Firefox. IE pathname
elimina la barra diagonal inicial, mientras que los otros navegadores no lo hacen. Entonces terminarás con /path
o path
dependiendo de su navegador.
– Verdadera Voluntad
09/04/2015 a las 19:00
jose oster
encontrado aquí: https://gist.github.com/jlong/2428561
var parser = document.createElement('a');
parser.href = "http://example.com:3000/pathname/?search=test#hash";
parser.protocol; // => "http:"
parser.host; // => "example.com:3000"
parser.hostname; // => "example.com"
parser.port; // => "3000"
parser.pathname; // => "/pathname/"
parser.hash; // => "#hash"
parser.search; // => "?search=test"
parser.origin; // => "http://example.com:3000"
Tenga en cuenta que si solo desea obtener las partes analizadas de la ubicación actual del navegador, las dos primeras líneas se convierten en parser = location;
y todas las siguientes líneas funcionan. Lo probé en Chrome e IE9 hace un momento.
– Lee Meador
26/04/2013 a las 17:20
También tenga en cuenta que pathname
no incluye la barra inclinada inicial en IE. Imagínate. 😀
– nevelis
21 de febrero de 2014 a las 6:45
Para IE, use “/” + parser.pathname
– sbose
27 de febrero de 2014 a las 11:07
Advertencia: volverá http:
aunque pases solo domain.com
a href (sin ningún protocolo). Quería usar esto para verificar si faltaba el protocolo, y si es así, podría agregarlo, pero asume http: por lo que no pude usarlo para este propósito.
–Max Hodges
30 de octubre de 2014 a las 6:27
El nombre de host en realidad incluye el protocolo. Prueba en la última versión de Chrome.
– Juan
23 de agosto de 2017 a las 15:47
Rems
Aquí hay una función simple que usa una expresión regular que imita la a
comportamiento de la etiqueta.
ventajas
Contras
–
function getLocation(href) {
var match = href.match(/^(https?\:)\/\/(([^:\/?#]*)(?:\:([0-9]+))?)([\/]{0,1}[^?#]*)(\?[^#]*|)(#.*|)$/);
return match && {
href: href,
protocol: match[1],
host: match[2],
hostname: match[3],
port: match[4],
pathname: match[5],
search: match[6],
hash: match[7]
}
}
–
getLocation("http://example.com/");
/*
{
"protocol": "http:",
"host": "example.com",
"hostname": "example.com",
"port": undefined,
"pathname": "https://stackoverflow.com/"
"search": "",
"hash": "",
}
*/
getLocation("http://example.com:3000/pathname/?search=test#hash");
/*
{
"protocol": "http:",
"host": "example.com:3000",
"hostname": "example.com",
"port": "3000",
"pathname": "/pathname/",
"search": "?search=test",
"hash": "#hash"
}
*/
EDITAR:
Aquí hay un desglose de la expresión regular.
var reURLInformation = new RegExp([
'^(https?:)//', // protocol
'(([^:/?#]*)(?::([0-9]+))?)', // host (hostname and port)
'(/{0,1}[^?#]*)', // pathname
'(\\?[^#]*|)', // search
'(#.*|)$' // hash
].join(''));
var match = href.match(reURLInformation);
pedro graham
var loc = window.location; // => "http://example.com:3000/pathname/?search=test#hash"
devuelve la URL actual.
Si desea pasar su propia cadena como una url (no funciona en IE11):
var loc = new URL("http://example.com:3000/pathname/?search=test#hash")
Entonces puedes analizarlo como:
loc.protocol; // => "http:"
loc.host; // => "example.com:3000"
loc.hostname; // => "example.com"
loc.port; // => "3000"
loc.pathname; // => "/pathname/"
loc.hash; // => "#hash"
loc.search; // => "?search=test"
tessa
La respuesta de freddiefujiwara es bastante buena, pero también necesitaba admitir URL relativas dentro de Internet Explorer. Se me ocurrió la siguiente solución:
function getLocation(href) {
var location = document.createElement("a");
location.href = href;
// IE doesn't populate all link properties when setting .href with a relative URL,
// however .href will return an absolute URL which then can be used on itself
// to populate these additional fields.
if (location.host == "") {
location.href = location.href;
}
return location;
};
Ahora úselo para obtener las propiedades necesarias:
var a = getLocation('http://example.com/aa/bb/');
document.write(a.hostname);
document.write(a.pathname);
Ejemplo:
function getLocation(href) {
var location = document.createElement("a");
location.href = href;
// IE doesn't populate all link properties when setting .href with a relative URL,
// however .href will return an absolute URL which then can be used on itself
// to populate these additional fields.
if (location.host == "") {
location.href = location.href;
}
return location;
};
var urlToParse="http://example.com/aa/bb/",
a = getLocation(urlToParse);
document.write('Absolute URL: ' + urlToParse);
document.write('<br />');
document.write('Hostname: ' + a.hostname);
document.write('<br />');
document.write('Pathname: ' + a.pathname);
rex m
js-uri (disponible en Google Code) toma una URL de cadena y resuelve un objeto URI a partir de ella:
var some_uri = new URI("http://www.example.com/foo/bar");
alert(some_uri.authority); // www.example.com
alert(some_uri); // http://www.example.com/foo/bar
var blah = new URI("blah");
var blah_full = blah.resolve(some_uri);
alert(blah_full); // http://www.example.com/foo/blah
¡¡¡Gracias!!! pero quiero uri = nueva ubicación (“ejemplo.com/aa/bb”) tipode(ventana.ubicación) == tipode(uri)
– freddie fujiwara
10 de abril de 2009 a las 2:30
Dado que window.location es una cadena, realmente no veo cómo sería posible o útil. ¿Por qué los tipos deben coincidir cuando se puede convertir fácilmente de uno a otro?
– Rex M
10 de abril de 2009 a las 2:33
developer.mozilla.org/en/DOM/window.ubicación es muy buena api!! así que espero convertir String en objeto window.location
– freddie fujiwara
10 de abril de 2009 a las 2:48
La configuración de window.location cambia el navegador para que no suceda.
– epascarello
10 de abril de 2009 a las 3:06
Mmm, eso es correcto. window.location no es una cadena, pero se puede asignar desde una cadena. No estoy seguro de si eso se puede imitar, he intentado asignar el prototipo de ubicación a un nuevo objeto uri pero eso no funcionó.
– Rex M
10 de abril de 2009 a las 3:53
En caso de que esté trabajando en la URL actual, puede acceder
hostname
ypathname
directamente desde ellocation
objeto.– rvighne
26 de junio de 2014 a las 14:54
¿Qué pasa con “lastPathPart”?
– Víctor
30/11/2018 a las 15:00
No es expresión regular, pero el Módulo de Python tldextract hace esto exactamente: github.com/john-kurkowski/tldextract
– Óliver Óliver
15 de mayo de 2019 a las 0:20