¿Tiene enlaces relativos a la raíz?


161

¿Hay alguna manera de que todos los enlaces de una página sean relativos al directorio raíz?

Por ejemplo, en www.example.com/fruits/apples/apple.htmlpodría tener un enlace que diga:

<a href="fruits/index.html">Back to Fruits List</a>

¿Este enlace apunta a www.example.com/fruits/apples/fruits/index.htmlo www.example.com/fruits/index.html? Si es el primero, ¿hay alguna manera de que apunte al segundo?

Respuestas:


293

Una URL relativa a la raíz comienza con un /carácter, para parecerse a algo así <a href="https://stackoverflow.com/directoryInRoot/fileName.html">link text</a>.

El enlace que publicó: <a href="fruits/index.html">Back to Fruits List</a>se vincula a un archivo html ubicado en un directorio llamado fruits, el directorio está en el mismo directorio que la página html en la que aparece este enlace.

Para convertirlo en una URL relativa a la raíz, cámbiela a:

<a href="/fruits/index.html">Back to Fruits List</a>

Editado en respuesta a la pregunta, en comentarios, de OP:

Al hacerlo / lo haré relativo a www.example.com, ¿hay alguna manera de especificar cuál es la raíz, por ejemplo, qué pasa si quiero que la raíz sea www.example.com/fruits en www.example.com/fruits/ manzanas / manzana.html?

Sí, al anteponer la URL, en los atributos hrefo src, con a /hará que la ruta sea relativa al directorio raíz. Por ejemplo, dada la página html en www.example.com/fruits/apples.html, la ade href="https://stackoverflow.com/vegetables/carrots.html"vinculará a la página www.example.com/vegetables/carrots.html.

El elemento de baseetiqueta le permite especificar la base-uri para esa página (aunque la baseetiqueta debería agregarse a cada página en la que fuera necesario utilizar una base específica, para esto simplemente citaré el ejemplo de W3:

Por ejemplo, dada la siguiente declaración BASE y la declaración A:

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN"
   "http://www.w3.org/TR/html4/strict.dtd">
<HTML>
 <HEAD>
   <TITLE>Our Products</TITLE>
   <BASE href="http://www.aviary.com/products/intro.html">
 </HEAD>

 <BODY>
   <P>Have you seen our <A href="../cages/birds.gif">Bird Cages</A>?
 </BODY>
</HTML>

el URI relativo "../cages/birds.gif" resolvería:

http://www.aviary.com/cages/birds.gif

Ejemplo citado de: http://www.w3.org/TR/html401/struct/links.html#h-12.4 .

Lectura sugerida:


1
Al hacerlo /hará que sea relativa a www.example.com, ¿hay una forma de especificar cuál es la raíz es, por ejemplo, lo que si quiero que la raíz es www.example.com/fruitsen www.example.com/fruits/apples/apple.html?
Haga clic en Upvote el

1
¿hay alguna manera de encontrarlo dinámicamente? Algo así como ~ en .NET? ¿Qué sucederá si en cada entorno tiene un nombre de carpeta diferente?
Kremena Lalova

21

Utilizar

<a href="/fruits/index.html">Back to Fruits List</a>

o

<a href="../index.html">Back to Fruits List</a>

1
../path funcionó pero / path no funcionó para mí en Expression Web al usarlo dentro de un archivo CSS. (El archivo estaba en / Directorio y referencia / DifferentDirectory
Clay Nichols

3
<a href="/fruits/index.html">Back to Fruits List</a>

3

Si está creando la URL desde el lado del servidor de una aplicación ASP.NET y está implementando su sitio web en un directorio virtual (por ejemplo, app2) en su sitio web, es decir, http://www.yourwebsite.com/app2/

entonces solo inserte

<base href="~/" />

justo después de la etiqueta del título.

así que siempre que utilices un pariente raíz, por ejemplo

<a href="/Accounts/Login"/> 

resolvería a " http://www.yourwebsite.com/app2/Accounts/Login "

De esta manera, siempre puede apuntar a sus archivos de manera relativamente absoluta;)

Para mí, esta es la solución más flexible.


2
Su respuesta simplemente no funciona. "tilde slash" funciona en el lado del servidor en las soluciones ASP.NET. Esta pregunta no se trata de soluciones ASP.NET del lado del servidor.
Anders Tornblad

1
Veo su teoría, pero funciona (tanto en la práctica como en teoría). El servidor reemplaza la "barra inclinada" por lo que sea la raíz de su aplicación al generar el HTML. ¿Lo has probado primero?
A-Majeed

Por supuesto que lo intenté. Los servidores web NO reemplazan tilde slash con la raíz de una aplicación. Solo las aplicaciones ASP.NET hacen esto. En otros entornos, no existe el concepto de "aplicación".
Anders Tornblad

No, no debería tener que decir que no uso ASP.NET. Hiciste esa suposición, pero no mencionaste la suposición en tu respuesta. Además, la pregunta no menciona nada sobre el entorno de tiempo de ejecución del servidor, por lo que USTED no debería haber asumido que la pregunta era sobre un ASP.NET. Si da una respuesta en StackOverflow, asegúrese de responder la pregunta, y no otra pregunta. Además, dije que esta pregunta no se trata de soluciones ASP.NET del lado del servidor.
Anders Tornblad

Trabajado para mí cuando rendí enlaces de JavaScript
Balaji Birajdar

0

Para dar una URL a una etiqueta de imagen que localiza el images/directorio en la raíz como

`logo.png`

debe dar srcURL comenzando de la /siguiente manera:

<img src="/images/logo.png"/>

Este código funciona en cualquier directorio sin ningún problema, incluso si todavía está en branches/europe/about.phpel logotipo se puede ver allí.


0

Use este código "./" como root en el servidor ya que funciona para mí.

<a href="./fruits/index.html">Back to Fruits List</a>

pero cuando esté en una máquina local use el siguiente código "../" como la ruta relativa de la raíz

<a href="../fruits/index.html">Back to Fruits List</a>
Al usar nuestro sitio, usted reconoce que ha leído y comprende nuestra Política de Cookies y Política de Privacidad.
Licensed under cc by-sa 3.0 with attribution required.