[thelist] Javascript off CSS on hide elements in page

Christian Heilmann lists at onlinetools.org
Mon Mar 28 05:36:52 CST 2005


Tony Crockford wrote:

> Create them via
>  
>
>>the DOM rather than messing about inside the markup with document.write.
>>http://www.onlinetools.org/articles/unobtrusivejavascript/
>>http://www.onlinetools.org/tools/puredom/
>>    
>>
>
>I'd like to do that, but haven't got my head round the method yet.
>isn't writing great gobs of content with javascript just as bad?
>  
>
Well, the idea is to create something that works without javascript and 
then enhance it with it. You are not writing out a lot with Javascript, 
you simply alter what is there.

>I've got a javascript link action so I can have a styled submit and a
>noscript submit button.  I want a way to hide the javascript submit -
>your suggestting I write the whole section with javascript and so if
>there is no javascript it doesn't get written?
>
>  
>
Add the normal submit button, and when Javascript is enabled replace it 
with the Javascript enabled one.

<input type="submit" value="send" id="sendbutton">

Create your styled link and replace the  submit:

oldbutton=document.getElementById('sendbutton');
newa=document.createElement('a');
newa.onclick=yourfunction;
newa.appendChild(document.createTextNode(oldbutton.value))
newa.className='yourclass';
oldbutton.parentNode.replaceChild(newa,oldbutton);


>fair enough, but I've also got a huge select list that auto jumps
>"onchange" writing that with javascript will be a pain for anyone that
>wants to add to the list or edit it...
>
>I was looking for a simple way...  seems to get simple I've got to work harder
>  
>
Same there, simply remove the button and add the onchange handler 
directly to the element via Javascript.

You  could also use my script to turn a list into a dropdown:  
http://icant.co.uk/forreview/tamingselect/







More information about the thelist mailing list