时间戳

首页 > 解决方案 > 从 URL 获取 html 数据属性

javascript - 从 URL 获取 html 数据属性

问题描述

我想将 prodName 和 prodItem 发送到将由 product.html 捕获的 URL，因此当用户单击产品 (index.html) 时，将创建一个 URL，并且将使用该 URL 但在 product.html 上。我想捕获 prodName 和 proItem 并将文本放在 product.html 中，但值将为空。

索引.html

$(".product-item").each(function(index, value) {
                var prodName = $(this).children("h2").attr("data-prodname");
                var prodItem = $(this).children("h2").attr("data-proditem");



                var link = $("<a href='product.html?prodName=" + prodName + "&prodItem=" + prodItem + "'/>");
                console.log(prodName);
                console.log(prodItem);
                $(this).children("img").wrap(link);
            });

        })

产品.html

$.urlParam = function (parameterName) {
            var results = new RegExp('[\?&]' + parameterName + '=([^&#]*)').exec(window.location.href);
            if (results === null) {
                return null;
            } else {
                return decodeURI(results[1]) || 0;
            }
        }
        var adminSerial = $.urlParam('ProdName');
        var dashboardName = $.urlParam('ProdItem');

        $('#product').html("The text is " + adminSerial);

标签： javascriptjquery

解决方案

我将此代码放在 pruduct.html 上，现在它可以工作了。

var getParams = function (url) {
        var params = {};
        var parser = document.createElement('a');
        parser.href = url;
        var query = parser.search.substring(1);
        var vars = query.split('&');
        for (var i = 0; i < vars.length; i++) {
            var pair = vars[i].split('=');
            params[pair[0]] = decodeURIComponent(pair[1]);
        }
        return params;
    };
    var mylocation ={};
    var mylocation = getParams(window.location.href);
    console.log(mylocation.prodName);
    $('#product').html(mylocation.prodName);
    $('#item').html(mylocation.prodItem);

推荐阅读