現在のページからJavaScriptを使用してホストURLを取得する方法


183

次のページにいるとします:

http://www.webmail.com/pages/home.aspx

"http://www.webmail.com"JavaScriptでホスト名()を取得するにはどうすればよいですか?


回答:


319
var host = window.location.hostname;

または多分

var host = "http://"+window.location.hostname;

または、連結が好きな場合

var protocol = location.protocol;
var slashes = protocol.concat("//");
var host = slashes.concat(window.location.hostname);

3
多分指定しないでくださいhttp。相対プロトコルを使用します。ハードコーディングするよりも適切かもしれません。
Darth Egregious

33
代わりに、ホスト名のwindow.location.host使用、またはポートが80でない場合、それは失敗します
ステファン・スタイガー

1
@MattBrowne文字列を生成するものを操作するときは、常にを使用する必要があると思いますconcat。例var a = 1 + 2 + " should be 12";では、このバージョンの連結バージョンですvar a = "".concat(1).concat(2).concat(" should be 12");。concatを使用+すると、連結ではなく計算のための多くの問題を回避できます。
Eric Herlitz、

3
hostnameドメインのみhostを提供し、ポートも提供します。これは、リンクの解剖学を見るのに最適なミニツールですbl.ocks.org/abernier/3070589
Lukas Liesis

4
window.location.originもうまく機能します-プロトコルとポートが含まれます。
rothschild86 2017年

96

ホスト名を取得するには: location.hostname

しかし、あなたの例はスキームも探しているのでlocation.origin、Chromeであなたがやりたいことをしているように見えますが、Mozdevのドキュメントでは言及されていません。あなたはそれを構築することができます

location.protocol + '//' + location.hostname

ポート番号も必要な場合(80でない場合):

location.protocol + '//' + location.host

Firefox 4にはないようですが、Chrome 12にはあります。仕様で定義されていますか?
Delan Azabani、2011年

こんにちは。ポートを取得するために、この例は魅力のように動作しました。おかげで
karthik k '18

FFは21.0以降、location.originをサポートしています:developer.mozilla.org/en-US/docs/Web/API/Window.location
zifot

67

これを使用して、プロトコル、ホスト、ポートを取得できます。

window.location.origin

ブラウザの互換性

デスクトップ

| Chrome                           | Edge  | Firefox (Gecko) | Internet Explorer | Opera | Safari (WebKit)                            |
|----------------------------------|-------|-----------------|-------------------|-------|--------------------------------------------|
| (Yes)                            | (Yes) | (Yes)           | (Yes)             | (Yes) | (Yes)                                      |
| 30.0.1599.101 (possibly earlier) | ?     | 21.0 (21.0)     | 11                | ?     | 7 (possibly earlier, see webkit bug 46558) |

モバイル

| Android                          | Edge  | Firefox Mobile (Gecko) | IE Phone | Opera Mobile | Safari Mobile                              |
|----------------------------------|-------|------------------------|----------|--------------|--------------------------------------------|
| (Yes)                            | (Yes) | (Yes)                  | (Yes)    | (Yes)        | (Yes)                                      |
| 30.0.1599.101 (possibly earlier) | ?     | 21.0 (21.0)            | ?        | ?            | 7 (possibly earlier, see webkit bug 46558) |

すべてのブラウザ互換性はMozilla Developer Networkからのものです


4
IEはこれをサポートしていないことを述べておきます。
Monso

これは新機能であり、古いブラウザではサポートされていないことをお伝えください。
kabirbaidhya 2017年

@kabirbaidhya詳細な互換性はどうですか?
Monso

良い。しかし、MDNの連中がブラウザ互換性テーブルを更新するとどうなりますか。これは、新しいブラウザのリリースではかなり頻繁に発生します。あなたは彼らのテーブルと同期するためにこれを更新し続ける必要があるかもしれません;)。
kabirbaidhya

実際にはそうではありません。これは、それをサポートする最も古いバージョンであり、最新のブラウザではありません。これは、サポートされている一部のブラウザーのバージョン番号を把握できる別のブラウザーを含めることを決定した場合にのみ変更されます。これは、ほとんどの新しいブラウザーが最初のリリースからのものであるため、いくぶん意味がありません。
Monso、2017

7
let path = window.location.protocol + '//' + window.location.hostname + ':' + window.location.port;


5

必要に応じて、いずれかのwindow.locationプロパティを使用できます。あなたの質問では、ホストwindow.location.hostnamewww.example.com)を使用して取得できるホストについて質問しています。あなたの例では、いわゆる何か見せているの原点使用して取得することができる、window.location.origin(例えばhttp://www.example.com)。

var path = window.location.origin + "/";

//result = "http://localhost:60470/"

2

目的によってはこれが好き

window.location.href.split("/")[2] == "localhost:17000" //always domain + port

任意のURL文字列に適用できます

var url = "http://localhost:17000/sub1/sub2/mypage.html?q=12";
url.split("/")[2] == "localhost:17000"
url.split("/")[url.split("/").length-1] == "mypage.html?q=12"

プロトコル、ドメイン、パスをURL文字列から削除(相対パス)

var arr = url.split("/");
if (arr.length>3)
   "/" + arr.splice(3, arr.length).join("/") == "/sub1/sub2/mypage.html?q=12"
弊社のサイトを使用することにより、あなたは弊社のクッキーポリシーおよびプライバシーポリシーを読み、理解したものとみなされます。
Licensed under cc by-sa 3.0 with attribution required.