#0
0.00000001 BSV
v© &âêLV0ö(0 Ü òv¬ cordQ text/html M!<!DOCTYPE html>
<html>
<head>
<title>My Website</title>
<link rel="stylesheet" type="text/css" href="styles.css">
<style>
/* Additional styles for search box and search history */
#search-box {
margin-bottom: 20px;
}
#search-input {
width: 200px;
padding: 5px;
font-size: 16px;
}
#search-history-container {
position: fixed;
bottom: 0;
left: 0;
right: 0;
background-color: #f9f9f9;
padding: 10px;
}
</style>
</head>
<body>
<header>
<h1>Welcome to My Website</h1>
<nav>
<ul>
<li><a href="#home">Home</a></li>
<li><a href="#about">About</a></li>
<li><a href="#services">Services</a></li>
<li><a href="#contact">Contact</a></li>
</ul>
</nav>
<div id="search-box">
<input type="text" id="search-input" placeholder="Search..." oninput="updateHTML(this.value)">
<button onclick="handleSearch()">Search</button>
</div>
</header>
<main>
<section id="home">
<h2>Home Section</h2>
<p>Welcome to my website!</p>
</section>
<section id="about">
<h2>About Section</h2>
<p>Learn more about me and my background.</p>
</section>
<section id="services">
<h2>Services Section</h2>
<p>Discover the services I offer.</p>
</section>
<section id="contact">
<h2>Contact Section</h2>
<p>Get in touch with me.</p>
</section>
</main>
<footer>
<p>© 2023 My Website. All rights reserved.</p>
</footer>
<div id="search-history-container">
<h3>Search History:</h3>
<ul id="search-history"></ul>
</div>
<script>
// Function to handle search
function handleSearch() {
const searchInput = document.getElementById("search-input");
const searchQuery = searchInput.value.trim();
if (searchQuery !== "") {
// Store search query in local storage
storeSearchQuery(searchQuery);
// Perform search operation (e.g., display results, redirect to search page, etc.)
performSearch(searchQuery);
// Clear the search input field
searchInput.value = "";
}
}
// Function to store search query in local storage
function storeSearchQuery(query) {
let searchHistory = localStorage.getItem("searchHistory");
if (searchHistory) {
// Retrieve existing search history from local storage
searchHistory = JSON.parse(searchHistory);
} else {
// Initialize search history as an empty array
searchHistory = [];
}
// Add the new search query to the search history array
searchHistory.push(query);
// Update the search history in local storage
localStorage.setItem("searchHistory", JSON.stringify(searchHistory));
// Display the updated search history
displaySearchHistory();
}
// Function to retrieve search history from local storage and display it
function displaySearchHistory() {
const searchHistory = JSON.parse(localStorage.getItem("searchHistory"));
if (searchHistory && searchHistory.length > 0) {
const searchHistoryElement = document.getElementById("search-history");
searchHistoryElement.innerHTML = "";
searchHistory.forEach((query) => {
const listItem = document.createElement("li");
listItem.textContent = query;
searchHistoryElement.appendChild(listItem);
});
}
}
// Function to update HTML code based on user input
function updateHTML(value) {
const updatedSection = document.getElementById("home");
updatedSection.innerHTML = `<h2>Home Section</h2><p>${value}</p>`;
}
// Call the displaySearchHistory function to show the search history initially
displaySearchHistory();
</script>
</body>
</html>
h
https://whatsonchain.com/tx/6ec312a2409bf0f8d39d1f937d44ad58b6dd1d252367f27a9462fdfb70d5e5dc