Member Avatar for veledrom

Hi,

I have a webpage with 3 pages which are called main.html, aboutus.html, contactus.html and result.html.

I want to put a searchbox into first 3 pages to be able to search a keyword in the html content and display in result.html.

How can do it?

Thanks

Note: I hope this is right place to ask.

  • 3 Contributors
  • 2 Replies
  • 105 Views
  • 1 Week Discussion Span
  • Latest Post Latest Post by jakx12

Dani AI

Generated

— for a tiny site (main.html, aboutus.html, contactus.html) there are three practical approaches. already pointed to hosted site-searches and mentioned PHP+MySQL; below are concise, practical ways to implement each and the tradeoffs.

Client-side (quick, no server changes)

  • Put a form that submits ?q=term to result.html. On result.html use JavaScript to read q, fetch each page (same origin required) and search the returned text. For better performance, pre-build an index.json (one fetch) instead of fetching every HTML file.
  • Example search loop (very small, adapt for highlighting and safety):
const pages = ['main.html','aboutus.html','contactus.html'];

async function search(q){
  const results = [];
  for(const p of pages){
    const txt = await fetch(p).then(r => r.text());
    const i = txt.toLowerCase().indexOf(q.toLowerCase());
    if(i !== -1) results.push({file: p, snippet: txt.substr(Math.max(0,i-50),150)});
  }
  return results;
}

Server-side (robust, scales better)

  • Use a script to extract text from each HTML (strip_tags() or DOM parsing), normalize and store into a pages table. Add a FULLTEXT index and query with MATCH ... AGAINST for relevance. Use prepared statements and escape output when rendering results.
  • Minimal schema/SQL idea:
CREATE TABLE pages (id INT AUTO_INCREMENT PRIMARY KEY, filename VARCHAR(255), content TEXT, FULLTEXT(content));
SELECT filename, MATCH(content) AGAINST(? IN NATURAL LANGUAGE MODE) AS score
FROM pages WHERE MATCH(content) AGAINST(?) ORDER BY score DESC;

Hosted engines (fastest to deploy)

  • Hosted search services give indexing, ranking and snippets out of the box but introduce external dependencies and possible ads/privacy considerations.

Recommendation and cautions

  • For three pages: client-side (or a small prebuilt index.json) is simplest. If you expect growth, need fuzzy matching, or better ranking, use a server-side index. Always validate and escape user input and output to avoid XSS, and remember fetch() won’t work from file://—serve pages over HTTP while testing.

Recommended Answers

All 2 Replies

Member Avatar for ade92uk

You have three options mentioned here:

they are mainly:
1. google sitesearch
2. sphider.eu
3. freefind

Member Avatar for jakx12

do it with php and mysql...it makes it so simple and organized

Be a part of the DaniWeb community

We're a friendly, industry-focused community of developers, IT pros, digital marketers, and technology enthusiasts meeting, networking, learning, and sharing knowledge.