JavaScript获取URL段和参数

Question

我看了一些问题，但仍然无法弄清楚如何做到这一点。
我有一个URL example.com/event/14aD9Uxp?p=10

我想要获取14aD9Uxp和p的值。
我尝试使用 split('/'+'?p=')，但它不起作用。
我想使用正则表达式，但我不太理解如何使用它。

- Spadaboyz

---

按照 / 进行 split，获取最后一个元素。再次按照 ? 进行 split，第一个元素是 14a....，再次进行 split，将第二个元素从最后一个分割数组中获取为 10。 - Tushar

正则表达式方式 \/([^\/?]*?)\?p=(\d+)$ - Tushar

你可能想查看location对象。 - Leo

Answer 1

var URL='example.com/event/14aD9Uxp?p=10';

var arr=URL.split('/');//arr[0]='example.com'
                       //arr[1]='event'
                       //arr[2]='14aD9Uxp?p=10'

var parameter=arr[arr.length-1].split('?');//parameter[0]='14aD9Uxp'
                                           //parameter[1]='p=10'

var p_value=parameter[1].split('=')[1];//p_value='10';

- Flake

---

谢谢，它有效。对于最后一部分，我使用split('?p=');，这样我可以直接获取p值。 - Spadaboyz

Answer 2

我已经创建了一个通用函数（在某些方面受限制），将返回给定参数的 GET 值。但是，只有在您不重写 URL 或修改 URL 的 GET 语法的情况下，此函数才能正常工作。

//Suppose this is your URL "example.com/event/14aD9Uxp?p=10";
            function GET(variable) {
                var str = window.location.href;


                str = str.split("/");
                // str = [example.com, event, 14aD9Uxp?p=10]


                //Get last item from array because this is usually where the GET parameter is located, then split with "?"
                str = str[str.length - 1].split("?");
                // str[str.length - 1] = "14aD9Uxp?p=10"
                // str[str.length - 1].split("?") = [14aD9Uxp, p=10]

                // If there is more than 1 GET parameter, they usually connected with Ampersand symbol (&). Assuming there is more, we need to split this into another array

                str = str[1].split("&");
                // Suppose this is your URL: example.com/event/14aD9Uxp?p=10&q=112&r=119
                // str = [p=10, q=112, r=119]
                // If there is only 1 GET parameter, this split() function will not "split" anything

                //Remember, there might only be 1 GET Parameter, so lets check length of the array to be sure.
                if (str.length > 1) {
                    
                    // This is the case where there is more than 1 parameter, so we loop over the array and filter out the variable requested
                    for (var i = 0; i < str.length; i++) {

                        // For each "p=10" etc. split the equal sign 
                        var param_full_str = str[i].split("=");
                        // param_full_str = [p, 10]

                        //Check if the first item in the array (your GET parameter) is equal to the parameter requested
                        if (param_full_str[0] == variable) {
                            // If it is equal, return the second item in the array, your GET parameter VALUE
                            return param_full_str[1];
                        }
                    }
                } else {
                    // This is the case where there is ONLY 1 GET parameter. First convert it to a String Type because Javascript decided that str was no longer a String
                    // Now split it with the equal sign.
                    str = str.toString().split("=");
                    return str[1];
                }
            }
            document.write(GET("p"));

- David Yue

Answer 3

function $_GET(param) {
    var vars = {};
    window.location.href.replace( 
        /[?&]+([^=&]+)=?([^&]*)?/gi, // regexp
        function( m, key, value ) { // callback
            vars[key] = value !== undefined ? value : '';
        }
    );

    if ( param ) {
        return vars[param] ? vars[param] : null;    
    }
    return vars;
}

我从这里收集了这个: http://www.creativejuiz.fr/blog/javascript/recuperer-parametres-get-url-javascript 它的效果很好。

要使用它，只需获取你的参数，如下所示:

var id = $_GET('id');

- David G

Answer 4

const url = new URL('http://example.com/event/14aD9Uxp?p=10');

const [,, eventId ] = url.pathname.split('/');
const p = url.searchParams.get('p');

浏览器支持情况：
https://caniuse.com/#feat=url
https://caniuse.com/#feat=urlsearchparams

- c01nd01r

Answer 5

简单无正则表达式的方法

var s = "example.com/event/14aD9Uxp?p=10";
var splitByForwardSlash = s.split('/');

// To get 14aD9Uxp
splitByForwardSlash[splitByForwardSlash.length-1]

// To get p=10
splitByForwardSlash[splitByForwardSlash.length-1].split('?')[1]

我想你知道从这里怎么走吧 :-)

- kkaosninja