30 lines
1007 B
HTML
30 lines
1007 B
HTML
<!DOCTYPE html>
|
|
<html>
|
|
<head>
|
|
<title>API Request Example</title>
|
|
</head>
|
|
<body>
|
|
<form>
|
|
<label for="input-field">Enter some text:</label>
|
|
<input type="text" id="input-field" name="input-field">
|
|
<button type="button" onclick="makeRequest()">Submit</button>
|
|
</form>
|
|
<div id="response-container"></div>
|
|
<script>
|
|
function makeRequest() {
|
|
const inputField = document.getElementById('input-field');
|
|
const inputValue = inputField.value;
|
|
fetch(`https://api.example.com/?q=${inputValue}`)
|
|
.then(response => response.json())
|
|
.then(data => {
|
|
const responseContainer = document.getElementById('response-container');
|
|
const html = `
|
|
<h2>API Response:</h2>
|
|
<pre>${JSON.stringify(data, null, 2)}</pre>
|
|
`;
|
|
responseContainer.innerHTML = html;
|
|
});
|
|
}
|
|
</script>
|
|
</body>
|
|
</html> |