Làm cách nào để phân tích cú pháp một URL bằng JavaScript (cũng với jQuery)?
Ví dụ, tôi có cái này trong chuỗi của mình,
url = "http://example.com/form_image_edit.php?img_id=33"
Tôi muốn nhận được giá trị của img_id
Tôi biết tôi có thể làm điều này dễ dàng với PHP parse_url(), nhưng tôi muốn biết làm thế nào nó có thể thực hiện được với JavaScript.
window.location.search.split('=')[1]. Tôi không thể tin rằng anh ấy đã nhận được 75 phiếu bầu cho điều đó !!
Câu trả lời:
Bạn có thể sử dụng thủ thuật tạo a-element, thêm url vào nó, sau đó sử dụng đối tượng Location của nó .
function parseUrl( url ) {
var a = document.createElement('a');
a.href = url;
return a;
}
parseUrl('http://example.com/form_image_edit.php?img_id=33').search
Cái nào sẽ xuất ra: ?img_id=33
Bạn cũng có thể sử dụng php.js để lấy hàm parse_url trong JavaScript .
Tôi khuyên bạn nên sử dụng thư viện URI.js tuyệt vời nếu bạn cần làm bất cứ điều gì hơn là xử lý URL siêu đơn giản.
url.match(/\?.+/)[0], cái nào ngắn hơn và có thể nhanh hơn rất nhiều.
Thử cái này:
var url = window.location;
var urlAux = url.split('=');
var img_id = urlAux[1]
Plugin jQuery tốt hiện có Purl (Trình phân tích cú pháp URL JavaScript) . Tiện ích này có thể được sử dụng theo hai cách - có jQuery hoặc không có ...
Lót:
location.search.replace('?','').split('&').reduce(function(s,c){var t=c.split('=');s[t[0]]=t[1];return s;},{})
lấy nó từ google, hãy thử sử dụng phương pháp này
function getQuerystring2(key, default_)
{
if (default_==null)
{
default_="";
}
var search = unescape(location.search);
if (search == "")
{
return default_;
}
search = search.substr(1);
var params = search.split("&");
for (var i = 0; i < params.length; i++)
{
var pairs = params[i].split("=");
if(pairs[0] == key)
{
return pairs[1];
}
}
return default_;
}
Điều này sẽ khắc phục một số trường hợp phức tạp trong câu trả lời của kobe:
function getQueryParam(url, key) {
var queryStartPos = url.indexOf('?');
if (queryStartPos === -1) {
return;
}
var params = url.substring(queryStartPos + 1).split('&');
for (var i = 0; i < params.length; i++) {
var pairs = params[i].split('=');
if (decodeURIComponent(pairs.shift()) == key) {
return decodeURIComponent(pairs.join('='));
}
}
}
getQueryParam('http://example.com/form_image_edit.php?img_id=33', 'img_id');
// outputs "33"
Tôi đã viết một thư viện phân tích cú pháp url javascript, URL.js , bạn có thể sử dụng nó cho việc này.
Thí dụ:
url.parse("http://mysite.com/form_image_edit.php?img_id=33").get.img_id === "33"
Một cái gì đó như thế này sẽ làm việc cho bạn. Ngay cả khi có nhiều giá trị chuỗi truy vấn thì hàm này sẽ trả về giá trị của khóa mong muốn của bạn.
function getQSValue(url)
{
key = 'img_id';
query_string = url.split('?');
string_values = query_string[1].split('&');
for(i=0; i < string_values.length; i++)
{
if( string_values[i].match(key))
req_value = string_values[i].split('=');
}
return req_value[1];
}
Bạn có thể sử dụng plugin jquery http://plugins.jquery.com/url . $.url("?img_id")sẽ trở lại33
function parse_url(str, component) {
// discuss at: http://phpjs.org/functions/parse_url/
// original by: Steven Levithan (http://blog.stevenlevithan.com)
// reimplemented by: Brett Zamir (http://brett-zamir.me)
// input by: Lorenzo Pisani
// input by: Tony
// improved by: Brett Zamir (http://brett-zamir.me)
// note: original by http://stevenlevithan.com/demo/parseuri/js/assets/parseuri.js
// note: blog post at http://blog.stevenlevithan.com/archives/parseuri
// note: demo at http://stevenlevithan.com/demo/parseuri/js/assets/parseuri.js
// note: Does not replace invalid characters with '_' as in PHP, nor does it return false with
// note: a seriously malformed URL.
// note: Besides function name, is essentially the same as parseUri as well as our allowing
// note: an extra slash after the scheme/protocol (to allow file:/// as in PHP)
// example 1: parse_url('http://username:password@hostname/path?arg=value#anchor');
// returns 1: {scheme: 'http', host: 'hostname', user: 'username', pass: 'password', path: '/path', query: 'arg=value', fragment: 'anchor'}
var query, key = ['source', 'scheme', 'authority', 'userInfo', 'user', 'pass', 'host', 'port',
'relative', 'path', 'directory', 'file', 'query', 'fragment'
],
ini = (this.php_js && this.php_js.ini) || {},
mode = (ini['phpjs.parse_url.mode'] &&
ini['phpjs.parse_url.mode'].local_value) || 'php',
parser = {
php: /^(?:([^:\/?#]+):)?(?:\/\/()(?:(?:()(?:([^:@]*):?([^:@]*))?@)?([^:\/?#]*)(?::(\d*))?))?()(?:(()(?:(?:[^?#\/]*\/)*)()(?:[^?#]*))(?:\?([^#]*))?(?:#(.*))?)/,
strict: /^(?:([^:\/?#]+):)?(?:\/\/((?:(([^:@]*):?([^:@]*))?@)?([^:\/?#]*)(?::(\d*))?))?((((?:[^?#\/]*\/)*)([^?#]*))(?:\?([^#]*))?(?:#(.*))?)/,
loose: /^(?:(?![^:@]+:[^:@\/]*@)([^:\/?#.]+):)?(?:\/\/\/?)?((?:(([^:@]*):?([^:@]*))?@)?([^:\/?#]*)(?::(\d*))?)(((\/(?:[^?#](?![^?#\/]*\.[^?#\/.]+(?:[?#]|$)))*\/?)?([^?#\/]*))(?:\?([^#]*))?(?:#(.*))?)/ // Added one optional slash to post-scheme to catch file:/// (should restrict this)
};
var m = parser[mode].exec(str),
uri = {},
i = 14;
while (i--) {
if (m[i]) {
uri[key[i]] = m[i];
}
}
if (component) {
return uri[component.replace('PHP_URL_', '')
.toLowerCase()];
}
if (mode !== 'php') {
var name = (ini['phpjs.parse_url.queryKey'] &&
ini['phpjs.parse_url.queryKey'].local_value) || 'queryKey';
parser = /(?:^|&)([^&=]*)=?([^&]*)/g;
uri[name] = {};
query = uri[key[12]] || '';
query.replace(parser, function($0, $1, $2) {
if ($1) {
uri[name][$1] = $2;
}
});
}
delete uri.source;
return uri;
}