जावास्क्रिप्ट - URL पथ का भाग प्राप्त करें

Question

जावास्क्रिप्ट का उपयोग करके URL से सिर्फ रास्ता निकालने का सही तरीका क्या है?

उदाहरण:
मेरे पास URL
http://www.somedomain.com/account/search?filter=a#top है
लेकिन मैं इस भाग / खाते / खोज को प्राप्त करना चाहूंगा

मैं jQuery का उपयोग कर रहा हूँ अगर वहाँ कुछ भी है कि leveraged किया जा सकता है।

Answer 1

इसमें अंतर्निहित window.locationवस्तु की एक संपत्ति है जो वर्तमान विंडो के लिए प्रदान करेगी।

// If URL is http://www.somedomain.com/account/search?filter=a#top

window.location.pathname // /account/search

// For reference:

window.location.host     // www.somedomain.com (includes port if there is one)
window.location.hostname // www.somedomain.com
window.location.hash     // #top
window.location.href     // http://www.somedomain.com/account/search?filter=a#top
window.location.port     // (empty string)
window.location.protocol // http:
window.location.search   // ?filter=a  

---

अपडेट करें, किसी भी URL के लिए समान गुणों का उपयोग करें:

यह पता चला है कि इस स्कीमा को URLUtils नामक एक इंटरफ़ेस के रूप में मानकीकृत किया जा रहा है , और क्या लगता है? मौजूदा window.locationऑब्जेक्ट और एंकर दोनों तत्व इंटरफ़ेस को लागू करते हैं।

तो आप किसी भी URL के लिए ऊपर दिए गए समान गुणों का उपयोग कर सकते हैं - बस URL के साथ एक एंकर बनाएं और गुणों को एक्सेस करें:

var el = document.createElement('a');
el.href = "http://www.somedomain.com/account/search?filter=a#top";

el.host        // www.somedomain.com (includes port if there is one[1])
el.hostname    // www.somedomain.com
el.hash        // #top
el.href        // http://www.somedomain.com/account/search?filter=a#top
el.pathname    // /account/search
el.port        // (port if there is one[1])
el.protocol    // http:
el.search      // ?filter=a

[१]: पोर्ट में शामिल गुणों के लिए ब्राउज़र समर्थन सुसंगत नहीं है, देखें: http://jessepollak.me/chrome-was-wrong-ie-was-right

यह क्रोम और फ़ायरफ़ॉक्स के नवीनतम संस्करणों में काम करता है । मेरे पास परीक्षण करने के लिए इंटरनेट एक्सप्लोरर के संस्करण नहीं हैं, इसलिए कृपया JSFiddle उदाहरण के साथ खुद का परीक्षण करें।

JSFiddle उदाहरण

एक आने वाली URLवस्तु भी है जो लंगर तत्व के बिना, खुद यूआरएल के लिए इस समर्थन की पेशकश करेगी। ऐसा लगता है कि इस समय कोई स्थिर ब्राउज़र इसका समर्थन नहीं करता है, लेकिन यह फ़ायरफ़ॉक्स 26 में आने के लिए कहा जाता है। जब आपको लगता है कि आपके पास इसके लिए समर्थन हो सकता है, तो इसे यहाँ आज़माएं ।

Comments

ओपी ने "एक URL" के लिए कहा, "विंडो का वर्तमान URL" नहीं। यदि आपके पास एक स्ट्रिंग के रूप में एक यूआरएल है तो क्या होगा?

— जोश नू

@JoshNoe ने बताया कि अब आप एंकर तत्वों पर समान गुणों का उपयोग कर सकते हैं। अद्यतन उत्तर देखें।

— निकोल

अच्छी जानकारी के लिए धन्यवाद। मैंने IE 9 और IE 8 के साथ परीक्षण किया (दोनों का अनुकरण करने के लिए IE 9 का उपयोग करें)। बेशक क्रोम और फ़ायरफ़ॉक्स नवीनतम संस्करण के साथ काम करता है :)

— झाओ

Answer 2

window.location.href.split('/');

आपको सभी URL भागों वाले एक सरणी देगा, जिसे आप सामान्य सरणी की तरह एक्सेस कर सकते हैं।

या केवल पथ भागों के साथ @Dylan द्वारा सुझाया गया एक और अधिक सुरुचिपूर्ण समाधान:

window.location.pathname.split('/');

Comments

window.location.pathname.split ( '/'); ज्यादातर मामलों में एक अधिक सुरुचिपूर्ण समाधान है यदि आप मानक प्रोटोकॉल और www इत्यादि URL के विभिन्न वर्गों तक पहुँचने की कोशिश कर रहे हैं

— डायलन

window.location.pathname.split ('/')। filter (फंक्शन (v) {return}}); जावास्क्रिप्ट 1.6 और ऊपर के लिए खाली तत्वों को हटा देगा।

— धवल देसाई

Answer 3

यदि यह वर्तमान url उपयोग window.location.pathname है अन्यथा इस नियमित अभिव्यक्ति का उपयोग करें:

var reg = /.+?\:\/\/.+?(\/.+?)(?:#|\?|$)/;
var pathname = reg.exec( 'http://www.somedomain.com/account/search?filter=a#top' )[1];

Comments

लगभग सही - लेकिन window.location.pathname के विपरीत यह विंडोज़ पर पाथनाम में ड्राइव अक्षर को शामिल नहीं करता है।

— थियो

एक regex के लिए, जो तब भी काम करता है जब कोई पथनाम नहीं होता है, का उपयोग करें:/.+?\:\/\/.+?(\/.+?)?(?:#|\?|)?$/

— स्कॉट्स

Answer 4

एक उपयोगी वेब एपीआई विधि है जिसे URL कहा जाता है

const url = new URL('http://www.somedomain.com/account/search?filter=a#top');
console.log(url.pathname.split('/'));
const params = new URLSearchParams(url.search)
console.log(params.get("filter"))

Answer 5

यदि आप किसी ऐसे URL के भाग प्राप्त करना चाहते हैं, जिसे आपने किसी चर में संग्रहीत किया है, तो मैं URL-Parse की सिफारिश कर सकता हूँ

const Url = require('url-parse');
const url = new Url('https://github.com/foo/bar');

प्रलेखन के अनुसार, यह निम्नलिखित भागों को निकालता है:

दिए गए यूआरएल उदाहरण में निम्नलिखित गुण हैं:

प्रोटोकॉल: URL की प्रोटोकॉल योजना (जैसे http :)। स्लैश: एक बूलियन जो इंगित करता है कि क्या प्रोटोकॉल के बाद दो फ़ॉरवर्ड स्लैश (//) हैं। अधिकार: प्रमाणीकरण सूचना भाग (जैसे उपयोगकर्ता नाम: पासवर्ड)। उपयोगकर्ता नाम: मूल प्रमाणीकरण का उपयोगकर्ता नाम। पासवर्ड: मूल प्रमाणीकरण का पासवर्ड। होस्ट: पोर्ट नंबर के साथ होस्ट नाम। होस्टनाम: पोर्ट नंबर के बिना होस्ट नाम। पोर्ट: वैकल्पिक पोर्ट नंबर। pathname: URL पथ। क्वेरी: पार्स की गई ऑब्जेक्ट तब तक क्वेरी स्ट्रिंग होती है, जब तक कि पार्सिंग झूठी पर सेट न हो जाए। हैश: URL का "टुकड़ा" हिस्सा जिसमें पाउंड-साइन (#) भी शामिल है। href: पूर्ण URL। मूल: URL की उत्पत्ति।

Answer 6

यदि आपके पास अमूर्त URL स्ट्रिंग है (करंट से नहीं window.location), तो आप इस ट्रिक का उपयोग कर सकते हैं:

let yourUrlString = "http://example.com:3000/pathname/?search=test#hash";

let parser = document.createElement('a');
parser.href = yourUrlString;

parser.protocol; // => "http:"
parser.hostname; // => "example.com"
parser.port;     // => "3000"
parser.pathname; // => "/pathname/"
parser.search;   // => "?search=test"
parser.hash;     // => "#hash"
parser.host;     // => "example.com:3000"

थैंक्स टू जेलांग