javascript - على - شرح جافا سكربت بالعربي pdf




كيف يمكنني الحصول على قيم سلسلة الاستعلام في JavaScript؟ (20)

ES2015 (ES6)

getQueryStringParams = query => {
    return query
        ? (/^[?#]/.test(query) ? query.slice(1) : query)
            .split('&')
            .reduce((params, param) => {
                    let [key, value] = param.split('=');
                    params[key] = value ? decodeURIComponent(value.replace(/\+/g, ' ')) : '';
                    return params;
                }, {}
            )
        : {}
};

بدون jQuery

var qs = (function(a) {
    if (a == "") return {};
    var b = {};
    for (var i = 0; i < a.length; ++i)
    {
        var p=a[i].split('=', 2);
        if (p.length == 1)
            b[p[0]] = "";
        else
            b[p[0]] = decodeURIComponent(p[1].replace(/\+/g, " "));
    }
    return b;
})(window.location.search.substr(1).split('&'));

باستخدام عنوان URL مثل: ?topic=123&name=query+string ، سيظهر ما يلي:

qs["topic"];    // 123
qs["name"];     // query string
qs["nothere"];  // undefined (object)

طريقة جوجل

تمزيق رمز جوجل وجدت الطريقة التي يستخدمونها: getUrlParameters

function (b) {
    var c = typeof b === "undefined";
    if (a !== h && c) return a;
    for (var d = {}, b = b || k[B][vb], e = b[p]("?"), f = b[p]("#"), b = (f === -1 ? b[Ya](e + 1) : [b[Ya](e + 1, f - e - 1), "&", b[Ya](f + 1)][K](""))[z]("&"), e = i.dd ? ia : unescape, f = 0, g = b[w]; f < g; ++f) {
        var l = b[f][p]("=");
        if (l !== -1) {
            var q = b[f][I](0, l),
                l = b[f][I](l + 1),
                l = l[Ca](/\+/g, " ");
            try {
                d[q] = e(l)
            } catch (A) {}
        }
    }
    c && (a = d);
    return d
}

إنه غامض ، لكنه مفهوم. لا يعمل لأن بعض المتغيرات غير محددة.

تبدأ في البحث عن المعلمات على عنوان من ? وأيضا من تجزئة # . ثم يتم تقسيم كل معلمة في علامة المساواة b[f][p]("=") (والتي تشبه indexOf ، فإنها تستخدم موضع char للحصول على المفتاح / القيمة). بعد أن يتم تقسيمها ، يتم التحقق مما إذا كانت المعلمة لها قيمة أم لا ، إذا كانت ثم قمت بتخزين قيمة d ، وإلا فإنها تستمر فقط.

في النهاية يتم إرجاع الكائن d ، والتعامل مع الهروب وعلامة + . هذا الكائن يشبه ملكي ، له نفس السلوك.

طريقي كمكون jQuery

(function($) {
    $.QueryString = (function(paramsArray) {
        let params = {};

        for (let i = 0; i < paramsArray.length; ++i)
        {
            let param = paramsArray[i]
                .split('=', 2);

            if (param.length !== 2)
                continue;

            params[param[0]] = decodeURIComponent(param[1].replace(/\+/g, " "));
        }

        return params;
    })(window.location.search.substr(1).split('&'))
})(jQuery);

استعمال

//Get a param
$.QueryString.param
//-or-
$.QueryString["param"]
//This outputs something like...
//"val"

//Get all params as object
$.QueryString
//This outputs something like...
//Object { param: "val", param2: "val" }

//Set a param (only in the $.QueryString object, doesn't affect the browser's querystring)
$.QueryString.param = "newvalue"
//This doesn't output anything, it just updates the $.QueryString object

//Convert object into string suitable for url a querystring (Requires jQuery)
$.param($.QueryString)
//This outputs something like...
//"param=newvalue&param2=val"

//Update the url/querystring in the browser's location bar with the $.QueryString object
history.replaceState({}, '', "?" + $.param($.QueryString));
//-or-
history.pushState({}, '', "?" + $.param($.QueryString));

اختبار الأداء (طريقة الانقسام مقابل طريقة التعبير العادي) ( jsPerf )

رمز الإعداد: طرق الإعلان

تقسيم كود الاختبار

var qs = window.GetQueryString(query);

var search = qs["q"];
var value = qs["value"];
var undef = qs["undefinedstring"];

رمز اختبار regex

var search = window.getParameterByName("q");
var value = window.getParameterByName("value");
var undef = window.getParameterByName("undefinedstring");

اختبار في Firefox 4.0 x 86 على Windows Server 2008 R2 / 7 x64

  • طريقة الانقسام : 144.780 ± 2.17 ٪ أسرع
  • طريقة التعبير العادي: 13،891 ± 0.85٪ | 90 ٪ أبطأ

هل هناك طريقة إضافية للمُكمِّل لاسترجاع قيم سلسلة الاستعلام عبر jQuery (أو بدون)؟

إذا كان الأمر كذلك ، كيف؟ إذا لم يكن كذلك ، فهل هناك ملحق يمكنه القيام بذلك؟


URLSearchParams

يدعم كل من Firefox 44+ و Opera 36+ و Edge 17+ و Safari 10.3 والإصدارات الأحدث و Chrome 49+ واجهة برمجة التطبيقات URLSearchParams :

هناك عنونة URL مقترحة من googleSearchParams للإصدارات الثابتة من IE.

لم يتم توحيدها من قبل W3C ، ولكنها معيار حي بواسطة WhatWG .

يمكنك استخدامه في الموقع ، ولكن تحتاج إلى إزالة ? علامة استفهام (على سبيل المثال ، باستخدام .slice(1) ):

let params = new URLSearchParams(location.search);

أو

let params = (new URL(location)).searchParams;

أو بالطبع على أي عنوان URL:

let url = new URL('https://example.com?foo=1&bar=2');
let params = new URLSearchParams(url.search);

يمكنك الحصول على .searchParams أيضًا باستخدام خاصية اختصار .searchParams في كائن عنوان URL ، كما يلي:

let params = new URL('https://example.com?foo=1&bar=2').searchParams;
params.get('foo'); // "1"
params.get('bar'); // "2" 

يمكنك قراءة / تعيين المعلمات من خلال get(KEY) ، set(KEY, VALUE) ، append(KEY, VALUE) API. يمكنك أيضًا التكرار على جميع القيم for (let p of params) {} .

يتوفر تطبيق مرجعي وصفحة نموذج للتدقيق والاختبار.


أنا أحب حل رايان فيلان . ولكن لا أرى أي نقطة في توسيع jQuery لذلك؟ لا يوجد استخدام لوظيفة jQuery.

من ناحية أخرى ، أحب الوظيفة المضمنة في Google Chrome: window.location.getParameter.

فلماذا لا تستخدم هذا؟ حسنا ، لا تملك المتصفحات الأخرى. لنقم بإنشاء هذه الوظيفة إذا لم تكن موجودة:

if (!window.location.getParameter ) {
  window.location.getParameter = function(key) {
    function parseParams() {
        var params = {},
            e,
            a = /\+/g,  // Regex for replacing addition symbol with a space
            r = /([^&=]+)=?([^&]*)/g,
            d = function (s) { return decodeURIComponent(s.replace(a, " ")); },
            q = window.location.search.substring(1);

        while (e = r.exec(q))
            params[d(e[1])] = d(e[2]);

        return params;
    }

    if (!this.queryStringParams)
        this.queryStringParams = parseParams(); 

    return this.queryStringParams[key];
  };
}

هذه الوظيفة أكثر أو أقل من Ryan Phelan ، لكنها ملفوفة بشكل مختلف: اسم واضح وأي تبعيات لمكتبات javascript الأخرى. المزيد عن هذه الوظيفة على مدونتي .


إذا كنت تجري المزيد من معالجة عناوين URL بدلاً من تحليل سلسلة البحث ، فقد تجد URI.js مفيدة. إنها مكتبة للتلاعب بعناوين URL - وتأتي مع جميع الأجراس والصفارات. (عذرا للإعلان عن النفس هنا)

لتحويل سلسلة البحث الخاصة بك إلى خريطة:

var data = URI('?foo=bar&bar=baz&foo=world').query(true);
data == {
  "foo": ["bar", "world"],
  "bar": "baz"
}

(كما يقوم URI.js "بإصلاح" querystrings سيئة مثل ?&foo&&bar=baz& to ?foo&bar=baz )


إليك طريقة سريعة للحصول على كائن مشابه $_GET PHP:

function get_query(){
    var url = location.search;
    var qs = url.substring(url.indexOf('?') + 1).split('&');
    for(var i = 0, result = {}; i < qs.length; i++){
        qs[i] = qs[i].split('=');
        result[qs[i][0]] = decodeURIComponent(qs[i][1]);
    }
    return result;
}

الاستعمال:

var $_GET = get_query();

بالنسبة لسلسلة الاستعلام x=5&y&z=hello&x=6 فهذا يعيد الكائن:

{
  x: "6",
  y: undefined,
  z: "hello"
}

اجعلها بسيطة باستخدام شفرة جافا سكريبت العادية:

function qs(key) {
    var vars = [], hash;
    var hashes = window.location.href.slice(window.location.href.indexOf('?') + 1).split('&');
    for(var i = 0; i < hashes.length; i++)
    {
        hash = hashes[i].split('=');
        vars.push(hash[0]);
        vars[hash[0]] = hash[1];
    }
    return vars[key];
}

يمكنك الاتصال به من أي مكان في شفرة جافا سكريبت:

var result = qs('someKey');

بعض الحلول المنشورة هنا غير فعالة. إن تكرار البحث العادي عن التعبير في كل مرة يحتاج فيها البرنامج النصي إلى الوصول إلى معلمة غير ضروري تمامًا ، حيث تكفي وظيفة واحدة لتقسيم المعلمات إلى كائن نمط مجموعة مصفوفة. إذا كنت لا تعمل مع واجهة برمجة تطبيقات HTML 5 History ، فهذا ضروري مرة واحدة فقط لكل تحميل للصفحة. الاقتراحات الأخرى هنا تفشل أيضًا في فك شفرة عنوان URL بشكل صحيح.

var urlParams;
(window.onpopstate = function () {
    var match,
        pl     = /\+/g,  // Regex for replacing addition symbol with a space
        search = /([^&=]+)=?([^&]*)/g,
        decode = function (s) { return decodeURIComponent(s.replace(pl, " ")); },
        query  = window.location.search.substring(1);

    urlParams = {};
    while (match = search.exec(query))
       urlParams[decode(match[1])] = decode(match[2]);
})();

مثال على querystring:

?i=main&mode=front&sid=de8d49b78a85a322c4155015fdce22c4&enc=+Hello%20&empty

نتيجة:

 urlParams = {
    enc: " Hello ",
    i: "main",
    mode: "front",
    sid: "de8d49b78a85a322c4155015fdce22c4",
    empty: ""
}

alert(urlParams["mode"]);
// -> "front"

alert("empty" in urlParams);
// -> true

يمكن بسهولة هذا يمكن تحسين عند معالجة سلاسل استعلام نمط صفيف جداً. مثال على ذلك here ، ولكن بما أن معلمات نمط الصفيف غير معرّفة في RFC 3986 لن أقوم بتلويث هذه الإجابة بكود المصدر. للراغبين في إصدار "ملوث" ، انظر إلى إجابة campbeln أدناه .

أيضا ، كما أشير في التعليقات ، ; هو محدد قانوني لأزواج key=value . سوف يتطلب تعبيرا أكثر تعقيدا للتعامل معه ; أو ، والتي أعتقد أنها غير ضرورية لأنه نادر الحدوث ; يستخدم وأود أن أقول أنه من غير المرجح أن يستخدم كلاهما. إذا كنت بحاجة إلى دعم ; بدلاً من & ، فقط قم بمبادلتها في regex.

إذا كنت تستخدم لغة معالجة مسبقة من جانب الخادم ، فقد ترغب في استخدام وظائف JSON الأصلية للقيام بالرفع الثقيل نيابة عنك. على سبيل المثال ، في PHP يمكنك كتابة:

<script>var urlParams = <?php echo json_encode($_GET, JSON_HEX_TAG);?>;</script>

اكثر سهولة!


مجرد توصية أخرى. يسمح الملحق Purl باسترداد جميع أجزاء عنوان URL ، بما في ذلك المرساة والمضيف وما إلى ذلك.

يمكن استخدامه مع أو بدون jQuery.

الاستخدام بسيط جدا وبارد:

var url = $.url('http://allmarkedup.com/folder/dir/index.html?item=value'); // jQuery version
var url = purl('http://allmarkedup.com/folder/dir/index.html?item=value'); // plain JS version
url.attr('protocol'); // returns 'http'
url.attr('path'); // returns '/folder/dir/index.html'

ومع ذلك ، واعتبارًا من 11 نوفمبر 2014 ، لم يعد يتم الحفاظ على URI.js ويوصي المؤلف باستخدام URI.js بدلاً من ذلك. يختلف المكون الإضافي jQuery في أنه يركز على العناصر - للاستخدام مع السلاسل ، استخدم URI مباشرة ، مع أو بدون jQuery. سيبدو رمز مماثل على هذا النحو ، مستندات أكثر اكتمالا here :

var url = new URI('http://allmarkedup.com/folder/dir/index.html?item=value'); // plain JS version
url.protocol(); // returns 'http'
url.path(); // returns '/folder/dir/index.html'

هذه كلها إجابات رائعة ، لكني احتجت إلى شيء أكثر قوة ، واعتقدت أنك قد ترغب في الحصول على ما قمت بإنشائه.

إنها طريقة مكتبة بسيطة تعمل على تشريح ومعالجة معلمات عناوين URL. يحتوي الأسلوب الثابت على الطرق الفرعية التالية التي يمكن استدعاؤها على عنوان URL الخاص بالموضوع:

  • getHost
  • getPath
  • getHash
  • setHash
  • getParams
  • getQuery
  • setParam
  • getParam
  • hasParam
  • removeParam

مثال:

URLParser(url).getParam('myparam1')
var url = "http://www.test.com/folder/mypage.html?myparam1=1&myparam2=2#something";

function URLParser(u){
    var path="",query="",hash="",params;
    if(u.indexOf("#") > 0){
        hash = u.substr(u.indexOf("#") + 1);
        u = u.substr(0 , u.indexOf("#"));
    }
    if(u.indexOf("?") > 0){
        path = u.substr(0 , u.indexOf("?"));
        query = u.substr(u.indexOf("?") + 1);
        params= query.split('&');
    }else
        path = u;
    return {
        getHost: function(){
            var hostexp = /\/\/([\w.-]*)/;
            var match = hostexp.exec(path);
            if (match != null && match.length > 1)
                return match[1];
            return "";
        },
        getPath: function(){
            var pathexp = /\/\/[\w.-]*(?:\/([^?]*))/;
            var match = pathexp.exec(path);
            if (match != null && match.length > 1)
                return match[1];
            return "";
        },
        getHash: function(){
            return hash;
        },
        getParams: function(){
            return params
        },
        getQuery: function(){
            return query;
        },
        setHash: function(value){
            if(query.length > 0)
                query = "?" + query;
            if(value.length > 0)
                query = query + "#" + value;
            return path + query;
        },
        setParam: function(name, value){
            if(!params){
                params= new Array();
            }
            params.push(name + '=' + value);
            for (var i = 0; i < params.length; i++) {
                if(query.length > 0)
                    query += "&";
                query += params[i];
            }
            if(query.length > 0)
                query = "?" + query;
            if(hash.length > 0)
                query = query + "#" + hash;
            return path + query;
        },
        getParam: function(name){
            if(params){
                for (var i = 0; i < params.length; i++) {
                    var pair = params[i].split('=');
                    if (decodeURIComponent(pair[0]) == name)
                        return decodeURIComponent(pair[1]);
                }
            }
            console.log('Query variable %s not found', name);
        },
        hasParam: function(name){
            if(params){
                for (var i = 0; i < params.length; i++) {
                    var pair = params[i].split('=');
                    if (decodeURIComponent(pair[0]) == name)
                        return true;
                }
            }
            console.log('Query variable %s not found', name);
        },
        removeParam: function(name){
            query = "";
            if(params){
                var newparams = new Array();
                for (var i = 0;i < params.length;i++) {
                    var pair = params[i].split('=');
                    if (decodeURIComponent(pair[0]) != name)
                          newparams .push(params[i]);
                }
                params = newparams;
                for (var i = 0; i < params.length; i++) {
                    if(query.length > 0)
                        query += "&";
                    query += params[i];
                }
            }
            if(query.length > 0)
                query = "?" + query;
            if(hash.length > 0)
                query = query + "#" + hash;
            return path + query;
        },
    }
}


document.write("Host: " + URLParser(url).getHost() + '<br>');
document.write("Path: " + URLParser(url).getPath() + '<br>');
document.write("Query: " + URLParser(url).getQuery() + '<br>');
document.write("Hash: " + URLParser(url).getHash() + '<br>');
document.write("Params Array: " + URLParser(url).getParams() + '<br>');
document.write("Param: " + URLParser(url).getParam('myparam1') + '<br>');
document.write("Has Param: " + URLParser(url).hasParam('myparam1') + '<br>');

document.write(url + '<br>');

// Remove the first parameter
url = URLParser(url).removeParam('myparam1');
document.write(url + ' - Remove the first parameter<br>');

// Add a third parameter
url = URLParser(url).setParam('myparam3',3);
document.write(url + ' - Add a third parameter<br>');

// Remove the second parameter
url = URLParser(url).removeParam('myparam2');
document.write(url + ' - Remove the second parameter<br>');

// Add a hash
url = URLParser(url).setHash('newhash');
document.write(url + ' - Set Hash<br>');

// Remove the last parameter
url = URLParser(url).removeParam('myparam3');
document.write(url + ' - Remove the last parameter<br>');

// Remove a parameter that doesn't exist
url = URLParser(url).removeParam('myparam3');
document.write(url + ' - Remove a parameter that doesn\"t exist<br>');

هنا طعمي في صنع الحل الممتاز أندي E في البرنامج المساعد jQuery كامل العضوية:

;(function ($) {
    $.extend({      
        getQueryString: function (name) {           
            function parseParams() {
                var params = {},
                    e,
                    a = /\+/g,  // Regex for replacing addition symbol with a space
                    r = /([^&=]+)=?([^&]*)/g,
                    d = function (s) { return decodeURIComponent(s.replace(a, " ")); },
                    q = window.location.search.substring(1);

                while (e = r.exec(q))
                    params[d(e[1])] = d(e[2]);

                return params;
            }

            if (!this.queryStringParams)
                this.queryStringParams = parseParams(); 

            return this.queryStringParams[name];
        }
    });
})(jQuery);

الصيغة هي:

var someVar = $.getQueryString('myParam');

أفضل ما في العالمين!


تحديث: سبتمبر -2018

يمكنك استخدام URLSearchParams وهو بسيط ويحتوي على دعم جيد من المستعرض .

const urlParams = new URLSearchParams(window.location.search);
const myParam = urlParams.get('myParam');

أصلي

لست بحاجة إلى jQuery لهذا الغرض. يمكنك استخدام بعض JavaScript الدقيق:

function getParameterByName(name, url) {
    if (!url) url = window.location.href;
    name = name.replace(/[\[\]]/g, '\\$&');
    var regex = new RegExp('[?&]' + name + '(=([^&#]*)|&|#|$)'),
        results = regex.exec(url);
    if (!results) return null;
    if (!results[2]) return '';
    return decodeURIComponent(results[2].replace(/\+/g, ' '));
}

الاستعمال:

// query string: ?foo=lorem&bar=&baz
var foo = getParameterByName('foo'); // "lorem"
var bar = getParameterByName('bar'); // "" (present with empty value)
var baz = getParameterByName('baz'); // "" (present with no value)
var qux = getParameterByName('qux'); // null (absent)


ملاحظة: إذا كانت المعلمة موجودة عدة مرات ( ?foo=lorem&foo=ipsum ) ، فستحصل على القيمة الأولى ( lorem ). لا يوجد معيار حول هذا وتختلف الأعراف ، انظر على سبيل المثال هذا السؤال: الموقف الرسمي لمفاتيح الاستعلام HTTP GET مكررة .
ملاحظة: الوظيفة حساسة لحالة الأحرف. إذا كنت تفضل اسم المعلمة غير حساس لحالة الأحرف ، فقم بإضافة "i" modifier إلى RegExp

هذا تحديث يستند إلى المواصفات URLSearchParams جديدة لتحقيق نفس النتيجة أكثر إيجازاً. راجع الإجابة بعنوان " URLSearchParams " أدناه.


أستخدم التعبيرات العادية كثيرًا ، لكن ليس لذلك.

يبدو لي أسهل وأكثر كفاءة بالنسبة لي لقراءة سلسلة الاستعلام مرة واحدة في طلبي ، وبناء كائن من جميع أزواج مفتاح / قيمة مثل:

var search = function() {
  var s = window.location.search.substr(1),
    p = s.split(/\&/), l = p.length, kv, r = {};
  if (l === 0) {return false;}
  while (l--) {
    kv = p[l].split(/\=/);
    r[kv[0]] = decodeURIComponent(kv[1] || '') || true;
  }
  return r;
}();

لURL مثل http://domain.com?param1=val1&param2=val2يمكنك الحصول على قيمتها في وقت لاحق في التعليمات البرمجية كما search.param1و search.param2.


كود الجولف:

var a = location.search&&location.search.substr(1).replace(/\+/gi," ").split("&");
for (var i in a) {
    var s = a[i].split("=");
    a[i]  = a[unescape(s[0])] = unescape(s[1]);
}

عرضه!

for (i in a) {
    document.write(i + ":" + a[i] + "<br/>");   
};

على جهاز Mac: test.htm?i=can&has=cheezburgerيعرض

0:can
1:cheezburger
i:can
has:cheezburger

لم تكن طريقة roshambo jQuery تهتم بفك شفرة URL

http://snipplr.com/view/26662/get-url-parameters-with-jquery--improved/

فقط إضافة تلك القدرة أيضا أثناء إضافة في بيان الإرجاع

return decodeURIComponent(results[1].replace(/\+/g, " ")) || 0;

الآن يمكنك العثور على البيانات المحدثة:

$.urlParam = function(name){
var results = new RegExp('[\\?&]' + name + '=([^&#]*)').exec(window.location.href);
if (!results) { return 0; }
return decodeURIComponent(results[1].replace(/\+/g, " ")) || 0;
}

فيما يلي نسخة موسعة من سلاسل الاستعلام "التعامل مع صفيف نمط التعامل" لـ Andy E. تم إصلاح الخلل ( ?key=1&key[]=2&key[]=3؛ 1تم فقده واستبداله [2,3]) ، وأدخل بعض التحسينات في الأداء الثانوي (إعادة فك ترميز القيم ، وإعادة حساب "[موضع] ، إلخ.) وإضافة عدد من التحسينات (الوظيفية ، والدعم ?key=1&key=2، ودعم ;المحددات) . تركت المتغيرات قصيرة بشكل مزعج ، لكنها أضافت تعليقات كثيرة لجعلها قابلة للقراءة (أوه ، وأعيد استخدامها vضمن الوظائف المحلية ، آسف إذا كان هذا مربكًا ؛).

سيتعامل مع querystring التالي ...

؟ اختبار = مرحبا والشخص = neek وشخص [] = جيف وشخص [] = جيم وشخص [اضافية] = جون وtest3 وnocache = 1398914891264

... جعله كائنًا يبدو ...

{
    "test": "Hello",
    "person": {
        "0": "neek",
        "1": "jeff",
        "2": "jim",
        "length": 3,
        "extra": "john"
    },
    "test3": "",
    "nocache": "1398914891264"
}

كما ترى أعلاه ، يعالج هذا الإصدار بعض المقاييس "غير الصحيحة " ، أي - person=neek&person[]=jeff&person[]=jimأو person=neek&person=jeff&person=jimلأن المفتاح قابل للتحديد وصالح (على الأقل في NameValueCollection.Add الخاص بـ dotNet ):

إذا كان المفتاح المحدد موجودًا بالفعل في مثيل NameValueCollection الهدف ، فسيتم إضافة القيمة المحددة إلى قائمة القيم المفصولة بفواصل في النموذج "value1، value2، value3".

يبدو أن هيئة المحلفين خارجاً بعض الشيء على مفاتيح متكررة لأنه لا توجد مواصفات. في هذه الحالة ، يتم تخزين مفاتيح متعددة كمصفوفة (زائفة). ولكن لاحظ أني لا أقوم بمعالجة القيم استنادًا إلى الفواصل إلى المصفوفات.

الرمز:

getQueryStringKey = function(key) {
    return getQueryStringAsObject()[key];
};


getQueryStringAsObject = function() {
    var b, cv, e, k, ma, sk, v, r = {},
        d = function (v) { return decodeURIComponent(v).replace(/\+/g, " "); }, //# d(ecode) the v(alue)
        q = window.location.search.substring(1), //# suggested: q = decodeURIComponent(window.location.search.substring(1)),
        s = /([^&;=]+)=?([^&;]*)/g //# original regex that does not allow for ; as a delimiter:   /([^&=]+)=?([^&]*)/g
    ;

    //# ma(make array) out of the v(alue)
    ma = function(v) {
        //# If the passed v(alue) hasn't been setup as an object
        if (typeof v != "object") {
            //# Grab the cv(current value) then setup the v(alue) as an object
            cv = v;
            v = {};
            v.length = 0;

            //# If there was a cv(current value), .push it into the new v(alue)'s array
            //#     NOTE: This may or may not be 100% logical to do... but it's better than loosing the original value
            if (cv) { Array.prototype.push.call(v, cv); }
        }
        return v;
    };

    //# While we still have key-value e(ntries) from the q(uerystring) via the s(earch regex)...
    while (e = s.exec(q)) { //# while((e = s.exec(q)) !== null) {
        //# Collect the open b(racket) location (if any) then set the d(ecoded) v(alue) from the above split key-value e(ntry) 
        b = e[1].indexOf("[");
        v = d(e[2]);

        //# As long as this is NOT a hash[]-style key-value e(ntry)
        if (b < 0) { //# b == "-1"
            //# d(ecode) the simple k(ey)
            k = d(e[1]);

            //# If the k(ey) already exists
            if (r[k]) {
                //# ma(make array) out of the k(ey) then .push the v(alue) into the k(ey)'s array in the r(eturn value)
                r[k] = ma(r[k]);
                Array.prototype.push.call(r[k], v);
            }
            //# Else this is a new k(ey), so just add the k(ey)/v(alue) into the r(eturn value)
            else {
                r[k] = v;
            }
        }
        //# Else we've got ourselves a hash[]-style key-value e(ntry) 
        else {
            //# Collect the d(ecoded) k(ey) and the d(ecoded) sk(sub-key) based on the b(racket) locations
            k = d(e[1].slice(0, b));
            sk = d(e[1].slice(b + 1, e[1].indexOf("]", b)));

            //# ma(make array) out of the k(ey) 
            r[k] = ma(r[k]);

            //# If we have a sk(sub-key), plug the v(alue) into it
            if (sk) { r[k][sk] = v; }
            //# Else .push the v(alue) into the k(ey)'s array
            else { Array.prototype.push.call(r[k], v); }
        }
    }

    //# Return the r(eturn value)
    return r;
};

كنت بحاجة إلى كائن من سلسلة الاستعلام ، وأكره الكثير من التعليمات البرمجية. قد لا يكون الأمر الأكثر قوة في الكون ، ولكنه مجرد بضعة أسطر من الشفرة.

var q = {};
location.href.split('?')[1].split('&').forEach(function(i){
    q[i.split('=')[0]]=i.split('=')[1];
});

this.htm?hello=world&foo=barسيؤدي عنوان URL مثل :

{hello:'world', foo:'bar'}

من MDN :

function loadPageVar (sVar) {
  return unescape(window.location.search.replace(new RegExp("^(?:.*[&\\?]" + escape(sVar).replace(/[\.\+\*]/g, "\\$&") + "(?:\\=([^&]*))?)?.*$", "i"), "$1"));
}

alert(loadPageVar("name"));

هذه هي وظيفة أنا خلقت مرة أخرى وأنا سعيد جدا مع. انها ليست حساسة لحالة الأحرف - وهو مفيد. كذلك ، إذا لم تكن QS المطلوبة موجودة ، فإنها تقوم فقط بإرجاع سلسلة فارغة.

أنا استخدم نسخة مضغوطة من هذا. أنا نشر غير مضغوط لأنواع المبتدئين لتفسير ما يحدث على نحو أفضل.

أنا متأكد من أن هذا يمكن تحسينه أو القيام به بشكل مختلف للعمل بشكل أسرع ، ولكنه دائمًا ما يكون رائعًا لما أحتاج إليه.

استمتع.

function getQSP(sName, sURL) {
    var theItmToRtn = "";
    var theSrchStrg = location.search;
    if (sURL) theSrchStrg = sURL;
    var sOrig = theSrchStrg;
    theSrchStrg = theSrchStrg.toUpperCase();
    sName = sName.toUpperCase();
    theSrchStrg = theSrchStrg.replace("?", "&") theSrchStrg = theSrchStrg + "&";
    var theSrchToken = "&" + sName + "=";
    if (theSrchStrg.indexOf(theSrchToken) != -1) {
        var theSrchTokenLth = theSrchToken.length;
        var theSrchTokenLocStart = theSrchStrg.indexOf(theSrchToken) + theSrchTokenLth;
        var theLocOfNextAndSign = theSrchStrg.indexOf("&", theSrchTokenLocStart);
        theItmToRtn = unescape(sOrig.substring(theSrchTokenLocStart, theLocOfNextAndSign));
    }
    return unescape(theItmToRtn);
}

function GET() {
        var data = [];
        for(x = 0; x < arguments.length; ++x)
            data.push(location.href.match(new RegExp("/\?".concat(arguments[x],"=","([^\n&]*)")))[1])
                return data;
    }


example:
data = GET("id","name","foo");
query string : ?id=3&name=jet&foo=b
returns:
    data[0] // 3
    data[1] // jet
    data[2] // b
or
    alert(GET("id")[0]) // return 3

function GetQueryStringParams(sParam)
{
    var sPageURL = window.location.search.substring(1);
    var sURLVariables = sPageURL.split('&');

    for (var i = 0; i < sURLVariables.length; i++)
    {
        var sParameterName = sURLVariables[i].split('=');
        if (sParameterName[0] == sParam)
        {
            return sParameterName[1];
        }
    }
}​

وهذه هي الطريقة التي يمكنك بها استخدام هذه الوظيفة على افتراض أن عنوان URL هو

http://dummy.com/?stringtext=jquery&stringword=jquerybyexample

var tech = GetQueryStringParams('stringtext');
var blog = GetQueryStringParams('stringword');




query-string