如何用JavaScript获取$_GET参数并更新script标签的data-email属性？

Hey there! I get it—supporting clients without PHP environments can be tricky, but we can solve this with pure JavaScript. Here are two reliable approaches to grab the email parameter from the URL and pass it to your countdown timer script:

1. First: Get the email Parameter from the URL #

First, we need a helper function to extract query parameters from the URL. This works smoothly across all modern browsers:

function getUrlParameter(name) {
    name = name.replace(/[\[]/, '\\[').replace(/[\]]/, '\\]');
    var regex = new RegExp('[\\?&]' + name + '=([^&#]*)');
    var results = regex.exec(location.search);
    return results === null ? '' : decodeURIComponent(results[1].replace(/\+/g, ' '));
}

This function takes a parameter name (like email) and returns its value from the URL, or an empty string if the parameter doesn’t exist.

2. Approach 1: Update an Existing Script Tag #

If you already have the script tag in your HTML (like the one you shared), we can modify its data-email attribute after the page loads. Just add this script after your countdown timer script tag:

<!-- Your original script tag (remove the PHP echo part) -->
<script type="text/javascript" src="https://example.com/countdown_timer_evergreen.php" data-launch_owner_email_hashed="94bd214b329301668349352de430bb6d" data-launch_id="43" data-email=""> </script>

<!-- Add this below to update the data-email attribute -->
<script>
function getUrlParameter(name) {
    name = name.replace(/[\[]/, '\\[').replace(/[\]]/, '\\]');
    var regex = new RegExp('[\\?&]' + name + '=([^&#]*)');
    var results = regex.exec(location.search);
    return results === null ? '' : decodeURIComponent(results[1].replace(/\+/g, ' '));
}

// Grab the email from the URL
const userEmail = getUrlParameter('email');

// Find your countdown script tag using its unique data-launch_id
const countdownScript = document.querySelector('script[data-launch_id="43"]');

// Update the data-email attribute if we found an email
if (userEmail && countdownScript) {
    countdownScript.setAttribute('data-email', userEmail);
    // Optional: If your script only reads attributes on first load, uncomment below to reload it
    // countdownScript.src = countdownScript.src;
}
</script>

Heads up: If your countdown script reads the data-email attribute only when it first loads, you’ll need to reload the script after updating the attribute (uncomment the last line in the code above).

3. Approach 2: Dynamically Create the Script Tag (Recommended) #

A more reliable method is to build the script tag entirely with JavaScript, so the data-email attribute is set before the script loads. This avoids any load-order issues:

<script>
function getUrlParameter(name) {
    name = name.replace(/[\[]/, '\\[').replace(/[\]]/, '\\]');
    var regex = new RegExp('[\\?&]' + name + '=([^&#]*)');
    var results = regex.exec(location.search);
    return results === null ? '' : decodeURIComponent(results[1].replace(/\+/g, ' '));
}

// Grab the email from the URL
const userEmail = getUrlParameter('email');

// Create the script tag from scratch
const countdownScript = document.createElement('script');
countdownScript.type = 'text/javascript';
countdownScript.src = 'https://example.com/countdown_timer_evergreen.php';
countdownScript.setAttribute('data-launch_owner_email_hashed', '94bd214b329301668349352de430bb6d');
countdownScript.setAttribute('data-launch_id', '43');
// Only add data-email if we found a value in the URL
if (userEmail) {
    countdownScript.setAttribute('data-email', userEmail);
}

// Add the script to the page (this triggers it to load)
document.body.appendChild(countdownScript);
</script>

This way, all data-* attributes are set before the script starts running, so your countdown timer will pick up the email parameter correctly on the first load.

Quick Notes #

• Make sure the helper function runs before you try to access the email parameter.
• If the URL has no email parameter, the data-email attribute will either be empty or omitted—adjust this based on what your script expects.

内容的提问来源于stack exchange，提问作者ben jaz