前端实现带参跳转页面

html部分
<body>
    <div class="list">
        <p data-id="1">商品详情1</p>
        <p data-id="2">商品详情2</p>
        <p data-id="3">商品详情3</p>
        <p data-id="4">商品详情4</p>
        <p data-id="5">商品详情5</p>
    </div>
</body>

js部分
window.onload = function() {
    $(".list").on("click", "p", function() {
        window.location.href = "detail.html?P>);
    })
}

跳转到的页面代码：

window.onload = function() {
     var dataId = getvl("dataId")
     alert(dataId)
}

function getvl(name) {
     var reg = new RegExp("(^|\\?|&)" + name + "=([^&]*)(\\s|&|$)", "i");
     if(reg.test(location.href))
          return unescape(RegExp.$2.replace(/\+/g, " "));
      return "";
};

2022-12-23
2022-12-23
2022-01-03
2022-12-23
2021-12-14
2021-11-28
2022-12-23
2022-12-23