How to make my own search engine
A simple code for making your own search engine which can do searches in multiple search engines (Google, Bing, Yahoo etc) simultaneously.
-----------------------------------------------------
<form id="searchForm">
<input type="text" id="queryInput" placeholder="Enter your search query">
<input type="submit" value="Search">
</form>
<div id="resultsContainer"></div>
<script>
document.getElementById('searchForm').addEventListener('submit', function(e) {
e.preventDefault();
var query = document.getElementById('queryInput').value;
search(query);
});
function search(query) {
// Perform search and fetch results
// Replace the following code with your search implementation
// This is just a placeholder
var searchResults = [
{
engine: 'Google',
results: [
{ title: 'Result 1 from Google', url: 'https://example.com/result1', description: 'Description of result 1 from Google' },
{ title: 'Result 2 from Google', url: 'https://example.com/result2', description: 'Description of result 2 from Google' }
]
},
{
engine: 'Bing',
results: [
{ title: 'Result 1 from Bing', url: 'https://example.com/result1', description: 'Description of result 1 from Bing' },
{ title: 'Result 2 from Bing', url: 'https://example.com/result2', description: 'Description of result 2 from Bing' }
]
}
];
displayResults(searchResults);
}
function displayResults(results) {
var container = document.getElementById('resultsContainer');
container.innerHTML = ''; // Clear previous results
results.forEach(function(engine) {
var engineHeading = document.createElement('h2');
engineHeading.textContent = engine.engine + ' Results';
container.appendChild(engineHeading);
engine.results.forEach(function(result) {
var resultDiv = document.createElement('div');
var titleLink = document.createElement('a');
titleLink.href = result.url;
titleLink.textContent = result.title;
var descriptionPara = document.createElement('p');
descriptionPara.textContent = result.description;
resultDiv.appendChild(titleLink);
resultDiv.appendChild(descriptionPara);
container.appendChild(resultDiv);
});
});
}
</script>
----------------------------------------------------------------------------------
Comments
Post a Comment