Get Input From Html/txt File? - with just html/css and maybe javascript?

free web hosting
Free Web Hosting > Computers & Tech > Designing > Web Design and HTML

Get Input From Html/txt File? - with just html/css and maybe javascript?

warbird
I was just wondering if it's possible to retrieve text (and maybe images) from a .html or .txt file. So for example you get the header and footer from an external file. Is it possible with just html/css and maybe a little javascript or does it require server side scripting like php???

-=jeroen=-

Reply

pbolduc
QUOTE(warbird @ Jan 1 2006, 05:45 AM)
I was just wondering if it's possible to retrieve text (and maybe images) from a .html or .txt file. So for example you get the header and footer from an external file. Is it possible with just html/css and maybe a little javascript or does it require server side scripting like php???

-=jeroen=-
*



You can use javascript to bring in headers, footers, and just about anything you want.

Here is a javascript I use to bring in an image roll that changes the pic everytime the page loads,

CODE
function imgroll(){
 var myimages=new Array()
 //specify random images below. You can have as many as you wish
 myimages[0]="images/imgrolls/140x350/140x350-01.jpg"
 myimages[1]="images/imgrolls/140x350/140x350-02.jpg"
 myimages[2]="images/imgrolls/140x350/140x350-03.jpg"
 myimages[3]="images/imgrolls/140x350/140x350-04.jpg"
 myimages[4]="images/imgrolls/140x350/140x350-05.jpg"
 myimages[5]="images/imgrolls/140x350/140x350-06.jpg"
 myimages[6]="images/imgrolls/140x350/140x350-07.jpg"
 myimages[7]="images/imgrolls/140x350/140x350-08.jpg"
 myimages[8]="images/imgrolls/140x350/140x350-09.jpg"
 myimages[9]="images/imgrolls/140x350/140x350-10.jpg"
 
 var ry=Math.floor(Math.random()*myimages.length)

    document.write('<img src="'+myimages[ry]+'" align="right" border=0>')
}

 imgroll()


Whatever is between single quotations in the:

document.write('<img src="'+myimages[ry]+'" align="right" border=0>')

line will print on your page when called in by a script tag.

CODE
<script language="" src="js/imgRoll.js"></script>


Just place the script tag where you want it to appear on yor page. In this example the javascript is saved as: imgRoll.js in the js folder and the above tag calls it in.

The problem here is the code between the single quotations must be optimized which makes it difficut to make quick changes when required because the code runs together and is not spaced.

Here is a sample code I use to call in some html code on my recommendation page:

CODE
recommendCode = '<table class="mcOuterTable" height="100%"cellpadding="0" cellspacing="0" align="center"><tr ><td style="height: 1%"><img id="mcHeader" src="images/headers/recommendus-550x50.JPG" border="0" width="550" height="50" alt=""></td></tr><tr><td style="height: 385; border: 1px solid #CCCCCC">&nbsp;</td></tr><tr><td style="height: 1%"><img src="images/footers/ffapb-550x35.jpg" border="0" width="550" height="35" alt="" align="middle"></td></tr></table>';

document.write(recommendCode)


The file is saved as: recCode.js and is called in by the tag: <script language="" src="js/imgRoll.js"></script>



If you are calling in a large piece of code such as a page header or footer it is better to use php. You to not really have to understand php to take advantage of it include capabilities.

If you have php available on your server simply save the page you want to bring text or code into with a php extention. Then create your header or footer file with whatever extention (.html, .js, .htm etc.). You call it in with with a simple php include tag:
CODE
<?php include "header-01.php" ?>


Place the include where you want the code to appear.

Hope this helps.

pete cool.gif

 

 

 


Reply

vujsa
Assuming that what you whant to do in insert the contents of one file into your webpage, I have several options I'll discuss. Additionally, if what you want to do is select certain content out of another file and insert it in to your webpage I have very few options I can discuss with you.

[/hr]

Inserting content from an outside source.
[hr=0]
IFRAMES
The <iframe> tag can be used to insert a file's content into your webpage. It will insert the entire file so you can actually show another website's page in your page.

The following code is the correct use of the <iframe> tag:
CODE
<IFRAME name="frame1" src="http://www.astahost.com/index.php" width=600 height=400 marginwidth=0 marginheight=0 frameborder=0 scrolling=auto></IFRAME>


That would insert the AstaHost forum index page into your page whereever you inserted the tag.

The IFRAME acts as a seperate entity inside your webpage and requires additionally coding to allow thw user to interact with the frame contents. The frames contents can't control the parents content so an IFRAME is not usable as a means of navigation of the website. Basically, you can't create a single link menu file for your website and use an IFRAME to insert it into you webpages.


[/hr]

SSI (Server Side Includes)
A server side include can be used to insert content into you webpage and gives much more control over what is displayed and how. Unlike the IFRAME, the SSI will directly insert the content into your webpage. As a result, the included content is a part of the main page and wil act like any other part of the webpage. Works great for headers, footers, menus, and advertisements.

An SSI is used like this:
First, create the content to be included:
(module1.html)
CODE
Search Engines:
- <a href="http://www.altavista.com>Alta Vista</a><br>
- <a href="http://www.excite.com>Excite</a><br>
- <a href="http://www.google.com>Google</a><br>
- <a href="http://www.lycos.com>Lycos</a><br>
- <a href="http://www.yahoo.com>Yahoo</a><br>


Then include that file in your main file like so:
(index.shtml)
CODE
<html>
<head>
 <title>This is an SSI test</title>
</head>
<body>
Some Content Here!
<!--#include file="module1.html" -->
More Content Here!
</body>
</html>


The downside to using SSI is that not all servers have the option availible. As a result, there isn't a lot of information about the command because most people that would have wanted to use the feature didn't have access to it on their host. Another downside to using SSI is that you usually need to tell the server when you want to use it by using the .shtml file extention instead of the .html extention. So to add SSI to your entire website, you would need to change all of your HTML files to SHTML files and of course change all of your internal links. You would also need to update your url at any other websites that link to your website. I would suggest revamping the entire website and leave your index.html intact with a redirect to the index.shtml. This will reduce the number of broken links on your website.

[hr=0]
PHP (PHP Hypertext Preprocessor)
Using the PHP include() or even require() functions is similar to the SSI option. The real difference is that PHP will work on any host that has PHP enabled. It doesn't matter what version of PHP you have, this will work. Since PHP is so widely offered these days, it will be easy to use this command.

The PHP include function will include the contents of the entire file being included into the main PHP file. Like the SSI option, the content of the included file is inserted in raw form into the mainpage. So the file can include code bits, text, or html. The end user will have no idea that the page was put together from more than one file.

To use the include function you'll first need to write the file to be included. For today just reuse the module1.html file from the SSI section.
Since PHP will not interpret the contnents of the included file, you can give the file any extention that you want. It will just open the file and dump the contents into youe page where ever you insert the command.

Here is your PHP file.
(index.php)
CODE
<html>
<head>
 <title>This is a PHP include test</title>
</head>
<body>
Some Content Here!
<?php include("module1.html"); ?>
More Content Here!
</body>
</html>


This will result in the same output as the SSI option.

Although there is wide support for PHP, you will still have the same setback as SSI in that you will need to tell the server when you want to use PHP by using the .php extention.

[/hr]


Reading and using data from an outside source
[hr=0]
By no means should this process be considered easy considering the number of PHP functions you would need to learn before starting. I'll try to give a basic rundown of how this works.

First you'll need to know exactly what it is that you want from the remote file. This is used for displaying the user's weather on your website or even displaying your favorite stock quotes on your site. You'll need to figure out a way to identify that data only and ignore all of the rest of the files content. You'll need to used a number of regular expressions to filter the data. This is not an easy task and I couldn't begin to try and explain it all.

Next, you'll need to actaully read the file. To do this, you'll need to use the PHP get_file_contents() function. Once you have the contents you'll apply whatever method you came up with to filter out the unwanted data. Now all you need to do is output the data you retrieved.

Since this requires so much coding in PHP prior to even beginning to create your page, I don't recommend it for new PHP users.

[/hr]


Here is a list of related resources that you may find helpful in deterimining which option to use or how to do use more advanced commands.
[hr=0]
  1. IFRAMES
  2. SSI
  3. PHP Include
  4. Remote File Reading

I hope that this information will be useful to you. If you have more questions regarding any of these options, please feel free to post them here or in a forum category that is directly related to the topic. I as well as many others will be happy to answer any further questions.

Good Luck cool.gif

vujsa

Reply


Got an Opinion! Express your Views! (no registration):-
Add your Reply/ Opinion/ Views/ Comments/ Suggestion/ Questions/ Queries etc.
Posts with decent grammar & English will be accepted and please refrain from profanities.
For asking a Question, We recommend you to sign-up (for free) so that you can track the topic easily.

Nature of your Post*: Opinion/ Reply/ Comments
Question/Query
Feedback to us.
       
Name   Email
Title/Question*

(Maximum characters: 10,000)
You have characters left.
Confirm Code:

Similar Topics

Keywords : input, html, txt, file, html, css, javascript

  1. Indentation In Html
    (4)
  2. Style P And H? Html Tags
    (2)
    Well, I have found that css was very hard to predict and precise control their apperance. When mix
    and use the p and h? tags. Their apperaence were not identity. Place the h? tags within the p tag
    causes style error on both firefox and IE. So, anyone should do it reserved, instead, place the p
    tag with any h? tags will do the jobs on both browsers. Still learning it coz it much varies when
    doing styles. Tested it on XHTML 1.0 Strict....
  3. Yaml - (x)html/css Framework
    (2)
    The YAML (Yet Another Multicolumn Layout) Framework is an excellent open source project that helps
    you to create two or three columns (X)HTML/CSS floated layouts. This framework is very easy to use
    and allows you to modifiy it to your own needs, this framework offers some tools for rapid
    development of modern and accessible CSS layouts. QUOTE Yet Another Multicolumn Layout (YAML)
    is an (X)HTML/CSS framework for creating modern and flexible floated layouts. The structure is
    extremely versatile in its programming and absolutely accessible for end users. Based on w....
  4. Sitepoint's Css And Html Reference Sites
    (2)
    Recently the folks at SitePoint.com launched two excelent online reference sites for web designers
    and developers, the first one is the SitePoint CSS Reference and the second one is the SitePoint
    HTML Reference (Beta) . Both of them are free and available to anyone and everyone who needs to
    lookup any information related to CSS and HTML in an easy and fast way. The SitePoint HTML
    Reference (Beta) is still in progress. Also, both of them are very detailed and up-to-date on each
    subject and are focused not only to beginners because they covers from general to advance....
  5. Cutenews 1.4.5 Security Alert Regarding Search.php
    please update your file immediately (1)
    Searching through our forum, I came across few posts mentioning "my site was hacked" while using
    CuteNews. So before I made this post I wanted to be sure if everyone here knew about CuteNew's
    serious vulnerability by searching our forum. I am also a victim of recent vandalism by someone from
    Germany who knew about this exploit. Please read Cutenews for clear understanding how, why and
    how-to. If you are using CuteNews as CMS for your site please visit the above URL and
    countermeasure for your CuteNews script. It looks like this information has been available sin....
  6. Javascript Problem
    (3)
    CODE text=new Array (
    "不要让我自己发帖哦,你也
    ;要多发主题啊!",
    "我们不是最大的犬中文站,
    ;但我们能做得更好!",
    "或许很多人都只是匆匆过客
    ;,但是这里仍然会愿意你留
    997....
  7. Html Emails How?
    (12)
    How on earth do you create HTML emails? I have been searching Google for some time now and can find
    ABSOLUTELY no information what so ever on how to ACTUALLY create HTML content emails. It just a
    bunch of programs and Microsoft applications, or testing facilities, I don't need any of this,
    there must be some coding system to it? I tried emailing using basic direct HTML tags (like ), but
    it fails (it just shows ), so how can I do this? I am not looking for anything really fancy, I
    just want to use some basic bolding and font changes and things to make it look a ....
  8. Xhtml, Javascript, Css And Frames.
    (0)
    Hello, I am building a form where a user selections several options (it uses javascript to modify
    checkbox values based on other selections). At the end I need to re-generate html code based on the
    selected form values, I don't particularly care what way it's done (although my site is
    XHTML 1.0 Transitional), but I need it to update on the fly as they change options. The HTML code
    is Google AdSense code, and I am trying to build my own from to generate all the different ad types
    and generate the code (it's not just for me). What kind of options do I have?....
  9. Html Table Issue.
    (18)
    Does anyone know how I might create a HTML table but using pure CSS (div's and what not). I
    really have no idea why, but for some odd reason my layout goes nuts if I try to use the table tags,
    even used properly with no errors the whole thing just brakes down (I don't use tables
    anywhere). So I figured my only option is to attempt to do it CSS way if possible?....
  10. About Html
    (15)
    How long did it take you to learn Html?? It took me about 2months to learn the basics lmao. I need
    a tuturial that has it all or a website.i would like it if someone did it. Thats why i get my
    friends to help me /biggrin.gif" style="vertical-align:middle" emoid=":D" border="0"
    alt="biggrin.gif" /> But they are nice friends thats why. Like 2 people have helped me Sten and
    Habble Sten Owns www.habbofront.com which uses Asta as its host and www.habble-aus.com which uses
    Asta as its host. so this must be a good host because 2 good sites that have expert Htmlers so need
    he....
  11. Html Stats
    (3)
    Do you know how to get website stats in a html code?? Like The amount of people viewing the site at
    the moment and stuff like that?? because i need to know. Thanks if you reply to this i am in need
    for it. /tongue.gif" style="vertical-align:middle" emoid=":P" border="0" alt="tongue.gif" />....
  12. Ie Png Transparency Javascript?
    is there one? (3)
    im working on a new design for my website but i need to be able to have transparent pngs. its all
    fine in firefox and i think IE 7 it works, but IE 6, cos i no half the people that will be going on
    my site will use internet explorer 6. so basically, does anyone know any javascript that will make
    transparent PNG's work on internet explorer? id use gif but i dont just want a transparent
    background. also, id use CSS and just gifs but i need some of it to not be transparent, lol im
    fussy. so if you know anything please tell me, i gave up on javascript, its too hard. ....
  13. Outsourcing A Style Section To An External Css File
    (7)
    Not being an HTML designer, but having a requirement to make a web page look pretty, I now have the
    following problem (I am absolutely convinced the solution for this must be very, very simple, I just
    need to find the right tutorial, which I couldn't find even after googling with the keywords
    outsource style section external CSS file): I want to take an inline ... stuff ... section from
    a web page, create a CSS file out of it, then replace the inline style section with a reference to
    the CSS file. Take as an example the page you are reading now. How would I be ....
  14. Stretching My Site Vertically
    Using CSS or HTML (6)
    I know it's possible, I've seen it one time. But I forgot. Many websites, if they hold more
    content than there is room for in the minimum height, the site stretches vertically. How can I do
    this? I only know that I need a background image of 1px height. Thanks in advance MediYama....
  15. Can I Make A Webpage With Javascript
    title kinda says it all (9)
    ok, i plan to make a game, and i was wondering if i can make my webpage in javascript, i just
    started learning it for this massive enderour i plan to over take, and i wanted to know if it was
    possible lol. im also learning php and mysql. Thanks, Zemon1....
  16. Scripts And Html
    (13)
    Hey /smile.gif" style="vertical-align:middle" emoid=":)" border="0" alt="smile.gif" />, In the
    note pad, I put the proper code for php ?> and save the file as name.php But i can't put
    that file in html. This is a big problem since Iam trying to make an online text based game. Whats
    the code to put a script inside a web page. And do i need any special software for it? If so
    where can i download it? Thanks for reading /biggrin.gif" style="vertical-align:middle" emoid=":D"
    border="0" alt="biggrin.gif" />.....
  17. Javascript Show / Hide Functions
    need some fine-tuning (3)
    Searching before posting my topic, i found this very helpful post. Javascript show + hide
    However, I'm still muddling around trying to fine tune it, and since i'm no good at coding,
    I'd appreciate any help. Using that example, how do I get the div text to be hidden on loading,
    rather than showing it all at page load. Also, is there a way to have the text change when clicked?
    so that for example, it would say "expand" when it's the small amount of text, and "collapse"
    when it's the full text? ....
  18. Firefox Inventing Its Own Html?
    (9)
    I am building a website for a client. I finally have the animations and the site content the way i
    want it. I updated the site via FTP, and IE displays it perfectly. Firefox however displays my "work
    in progress" animations still, even though the index file references the new animation. I have
    cleared cache, and even looked up the site on different computers, and on every one, FF displays
    those darn rough draft animations while IE works perfectly. Any idea as to what is going on here?....
  19. Quick Tips On Html And Css
    (11)
    Here are just some general tips, helpers and time-savers for HTML and CSS. HTML Ideally, you should
    be working under the XHTML 1.1 doctype specification. Some reasons: Improved semanticism - make use
    of the elements available appropriately to convey the information as it was intended. Improved
    understanding - because of an increase in semanticism, it's easier for your audience to
    understand what your trying to convey. Cleaner code - due to the deprecation of some elements and
    the strict requirements of nesting, closing and structure, your code becomes much cleane....
  20. Bulletproof HTML: 37 Steps To Perfect Markup
    Excellent article that highlights and answers most FAQ about HTML (4)
    Hi, i want to share with everybody this excellent article at sitepoint.com that i just read, it
    highlights and answers most FAQ about HTML, it's very consice and simply and for me it is a must
    to read. You can read it at Bulletproof HTML: 37 Steps to Perfect Markup . Best regards,....
  21. Home Videos
    html code for home video (4)
    I was wondering if anyone knows how to turn a home video that is saved on your computer to that of a
    html code so I can put it onto my myspace page... Please if anyone at all knows how to do this
    please please help me!!!!....
  22. A First Peep Into Html
    (5)
    Dear friends HTML is the building block of any web page. Without it no pages can be written though
    there are some exceptions. Even you got to have some knowledge of HTML to write dynamic web
    applications. An HTML file is a text file containing small markup tags The markup tags tell the Web
    browser how to display the page An HTML file must have an htm or html file extension An HTML file
    can be created using a simple text editor HTML is acronym of Hyper Text Markup Language. This time
    I will discuss about HTML tags. Dear friends HTML is the building block of any web pa....
  23. HTML Editor
    (23)
    I am sick of using notepad to create my HTML pages and I want somthing better. Are there any
    programs available that are easier to use than notepad for html editing. If so i wolud like to know
    about them. Thanx....
  24. How To Use Psd File
    (13)
    I'm redesigning my website, and I found a template for it that is in a PSD format. I have Adobe
    Photoshop so I can open it and edit it. I changed the text and images exactly the way I want it, but
    what do I do from here? How do I get the images and text from the PSD to the individual files that
    makes it up? Or am I supposed to be doing that at all? Thanks....
  25. Css For Input Text Only
    I don't think there is a solution but... (16)
    I have read (or glimse through) all the CSS 2 specification and google a lot but found no solution
    for the following problem. Anyone can help? The basic idea is the input field for the type text ,
    password is quite small, so I want to change its width by CSS CODE input {   width :
    400px; } However, this affects the width of the radio button too (in most current browser). Is
    there anyway that I can apply this CSS to input field which is of the type text or password
    ONLY? The tricky part is I MUST NOT use any additional attribute in input fie....
  26. Free Shoutbox? HTML, Flash or PHP Code
    (24)
    does anyone know where i can find a free shoubox thats customisable? it can be in html, php or flash
    format. thanks in advance paul....
  27. Random Images On Eacht Pageload And Refresh.
    best in plain htlm or javascript (6)
    Im looking for somethin that puts a diffrent image for each pageload/refresh. And it should be
    something that dosent need any super server technolgys like php and mysql and all that stuff.
    something that is enough just on the page and finished.....
  28. Force Object To Load Last
    html question (2)
    Alright html wizards...i've got a question ^_^ I assume that, like other programming codes, html
    and php compilers read a code from top to bottom. Say I have a object though...and I want it to load
    last...how do I do that? Let's just pretend I have an image that I do not want to load until
    everything else on the webpage is loaded...how can I set that up? Is there perhaps a javascript code
    for it...or maybe a CSS style I could add onto the object? Or better yet, is it possible to make
    everything within a div/span/table tag load last? Another thing...if I leave an....
  29. Embedding XML into HTML
    (2)
    Hi, I am looking for a way to embed external rss/xml files into my html page, how/is this possible?....
  30. Basic Tips and Tricks in HTML
    (15)
    Here is some quick links for basic html coding... A quick and easy way to create your first web
    page! -> The easiest HTML guide for beginners You'll learn how to create tables from real
    examples. -> How to create TABLE? You will learn how to create frames from a real example.
    You'll see how to create a borderless frame, how to specify the target frame, etc. -> How to
    build FRAMES? Follow a few easy steps to add sound to your web pages. -> How to add sound to a
    web page? This page tells you how to automatically load a visitor to another web p....

    1. Looking for input, html, txt, file, html, css, javascript

Searching Video's for input, html, txt, file, html, css, javascript
advertisement




Get Input From Html/txt File? - with just html/css and maybe javascript?



 

 

 

 

ADD REPLY / Got an Opinion! a humble request :-) RAPID SEARCH! Free Hosting [X]
Express your Opinions, Thoughts or Contribute more info. to help others.
Ask your Doubts & Queries to get answers, So that "Together We can help others!"
Register FREE for AD-FREE forum, Create your own topics, Ask Questions, track topics, setup subscriptions & notifications and Get a Free Website w/ Email and FTP.
500MB Space *No Ads*, CPanel, FTP, PHP, MySQL, EMails - 100% FREE