如何创建一个表单来更改按钮的href url的一部分？

要创建一个表单来更改按钮的href URL的一部分，你可以使用HTML、CSS和JavaScript来实现。以下是一个简单的示例：

HTML部分

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Change Href URL</title>
    <link rel="stylesheet" href="styles.css">
</head>
<body>
    <form id="urlForm">
        <label for="baseUrl">Base URL:</label>
        <input type="text" id="baseUrl" name="baseUrl" placeholder="Enter base URL">
        
        <label for="newPart">New Part:</label>
        <input type="text" id="newPart" name="newPart" placeholder="Enter new part">
        
        <button type="submit">Change URL</button>
    </form>
    
    <a id="dynamicLink" href="#" target="_blank">Click Me</a>

    <script src="script.js"></script>
</body>
</html>

CSS部分（styles.css）

body {
    font-family: Arial, sans-serif;
    margin: 20px;
}

form {
    margin-bottom: 20px;
}

label {
    display: block;
    margin-top: 10px;
}

input {
    width: 300px;
    padding: 8px;
    margin-top: 5px;
}

button {
    padding: 10px 20px;
    margin-top: 10px;
}

JavaScript部分（script.js）

document.getElementById('urlForm').addEventListener('submit', function(event) {
    event.preventDefault();
    
    const baseUrl = document.getElementById('baseUrl').value;
    const newPart = document.getElementById('newPart').value;
    
    const dynamicLink = document.getElementById('dynamicLink');
    dynamicLink.href = `${baseUrl}/${newPart}`;
});