Haben Sie Links zu root?

161

Gibt es eine Möglichkeit, alle Links auf einer Seite relativ zum Stammverzeichnis zu erstellen?

Zum Beispiel www.example.com/fruits/apples/apple.htmlkönnte ich einen Link haben, der sagt:

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

Würde dieser Link auf www.example.com/fruits/apples/fruits/index.htmloder verweisen www.example.com/fruits/index.html? Wenn der erste, gibt es eine Möglichkeit, ihn stattdessen auf den zweiten zu verweisen?

html location-href Klicken Sie auf Upvote
quelle

Antworten:

293

Eine root-relative URL beginnt mit einem /Zeichen, um ungefähr so ​​auszusehen <a href="https://stackoverflow.com/directoryInRoot/fileName.html">link text</a>.

Der von Ihnen gepostete Link: <a href="fruits/index.html">Back to Fruits List</a>verweist auf eine HTML-Datei in einem Verzeichnis mit dem Namen fruits, wobei sich das Verzeichnis im selben Verzeichnis befindet wie die HTML-Seite, auf der dieser Link angezeigt wird.

Um es zu einer root-relativen URL zu machen, ändern Sie es in:

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

Bearbeitet als Antwort auf die Frage in Kommentaren von OP:

Wenn Sie also relativ zu www.example.com arbeiten, gibt es eine Möglichkeit, anzugeben, was die Wurzel ist, z. B. was, wenn die Wurzel www.example.com/fruits in www.example.com/fruits/ sein soll. Äpfel / Apfel.html?

Ja, wenn Sie der URL in den Attributen hrefoder srcein a voranstellen, /wird der Pfad relativ zum Stammverzeichnis erstellt. Wenn beispielsweise die HTML-Seite unter angegeben ist www.example.com/fruits/apples.html, wird das avon href="https://stackoverflow.com/vegetables/carrots.html"auf die Seite verlinkt www.example.com/vegetables/carrots.html.

Mit dem baseTag- Element können Sie die Basis-URL für diese Seite angeben (obwohl das baseTag zu jeder Seite hinzugefügt werden müsste, auf der eine bestimmte Basis verwendet werden musste, zitiere ich dazu einfach das Beispiel des W3:

Zum Beispiel bei folgender BASE-Deklaration und A-Deklaration:

<!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>

Die relative URI "../cages/birds.gif" würde sich auflösen in:

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

Beispiel zitiert aus: http://www.w3.org/TR/html401/struct/links.html#h-12.4 .

Vorgeschlagene Literatur:

David sagt, Monica wieder einsetzen
quelle
1
Damit /wird es in Bezug auf www.example.com, ist es eine Möglichkeit zu geben , was die Wurzel ist, zum Beispiel was passiert , wenn ich die Wurzel sein will www.example.com/fruitsin www.example.com/fruits/apples/apple.html?
Klicken Sie auf Upvote
1
Gibt es eine Möglichkeit, es dynamisch zu finden? So etwas wie ~ in .NET? Was passiert, wenn Sie in jeder Umgebung einen anderen Ordnernamen haben?
Kremena Lalova
21

Verwenden

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

oder

<a href="../index.html">Back to Fruits List</a>
amit_g
quelle
1
../path hat funktioniert, aber / path hat bei Expression Web in einer CSS-Datei nicht funktioniert. (Datei war in / Verzeichnis und Referenz / DifferentDirectory
Clay Nichols
3 
<a href="/fruits/index.html">Back to Fruits List</a>
moe
quelle
3

Wenn Sie die URL von der Serverseite einer ASP.NET-Anwendung aus erstellen und Ihre Website in einem virtuellen Verzeichnis (z. B. app2) auf Ihrer Website bereitstellen, z. B. http://www.yourwebsite.com/app2/

dann einfach einfügen

<base href="~/" />

kurz nach dem Titel-Tag.

Also, wann immer Sie root relative verwenden, z 

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

würde sich zu " http://www.yourwebsite.com/app2/Accounts/Login " auflösen

Auf diese Weise können Sie immer relativ absolut auf Ihre Dateien verweisen;)

Für mich ist dies die flexibelste Lösung.

A-Majeed
quelle
2
Ihre Antwort funktioniert einfach nicht. "Tilde Slash" funktioniert in ASP.NET-Lösungen serverseitig. Diese Frage bezieht sich nicht auf serverseitige ASP.NET-Lösungen.
Anders Tornblad
1
Ich sehe Ihre Theorie, aber sie funktioniert (sowohl in der Praxis als auch in der Theorie). Der Server ersetzt beim Generieren des HTML-Codes den "Tilde-Schrägstrich" durch den Stamm Ihrer Anwendung. Hast du es zuerst versucht?
A-Majeed
Natürlich habe ich es versucht. Webserver ersetzen den Tilde-Schrägstrich NICHT durch das Stammverzeichnis einer Anwendung. Dies tun nur ASP.NET-Anwendungen. In anderen Umgebungen gibt es kein Konzept wie eine "Anwendung".
Anders Tornblad
Nein, ich sollte nicht sagen müssen, dass ich ASP.NET nicht verwende. Sie haben diese Annahme gemacht, diese aber in Ihrer Antwort nicht erwähnt. Außerdem wird in der Frage nichts über die Server-Laufzeitumgebung erwähnt, sodass SIE nicht davon ausgehen sollten, dass es sich bei der Frage um ein ASP.NET handelt. Wenn Sie auf StackOverflow eine Antwort geben, stellen Sie bitte sicher, dass Sie die Frage beantworten - und nicht irgendeine andere Frage. Außerdem habe ich gesagt, dass es bei dieser Frage nicht um serverseitige ASP.NET-Lösungen geht.
Anders Tornblad
Arbeitete für mich, als ich Links aus Javascript gerendert habe
Balaji Birajdar
0

Geben Sie eine URL zu einem Image-Tag, das das images/Verzeichnis im Stammverzeichnis wie findet

`logo.png`

Sie sollten die srcURL /wie folgt angeben:

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

Dieser Code funktioniert in allen Verzeichnissen ohne Probleme, auch wenn Sie sich branches/europe/about.phpnoch im Logo befinden.

Tum Ozel Okullar
quelle
0

Verwenden Sie diesen Code "./" als Root auf dem Server, da er für mich funktioniert

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

Wenn Sie sich jedoch auf einem lokalen Computer befinden, verwenden Sie den folgenden Code "../" als relativen Pfad für den Stamm

<a href="../fruits/index.html">Back to Fruits List</a>
König Zecole
quelle