58 Comments
- b7illsmith, on 10/12/2007, -1/+36If you're using Firefox, download the Web Developer extension. From the toolbar, select Miscellaneous -> Edit HTML.
With this you can edit HTML in real time on the current page you are viewing. Have fun. - eplawless, on 10/12/2007, -1/+22So where's the AJAX? Javascript is not AJAX. There isn't anything server-side going on here.
- chrizel, on 10/12/2007, -0/+17You don't even need an extension, just copy this into your address bar and you can edit the current web page. (tested with firefox and safari)
javascript:document.body.contentEditable = 'true'; document.designMode='on'; void 0 - phytar, on 10/12/2007, -2/+13Ok, this is ridiculous, this page is nothing more than this - paste it into an HTML page (replacing all [ with [/div>
[textarea id="edit">[/textarea>
[script>
setInterval(function(){
document.getElementById("html").innerHTML =
document.getElementById("edit").value;
}, 100);
[/script> - altintx, on 10/12/2007, -1/+12This is not AJAX. Over a little more than the last year, AJAX just became synonymous with JavaScript. Attaching a DHTML event to a textarea and using JavaScript to update a frame is not AJAX. It's DHTML like has existed since IE4/NS4 in 1997.
This story finally made me snap. AJAX is not JavaScript. It's not DHTML. It's not filtering. AJAX is a way to manipulate data on the server side and push it back to an output page. JavaScript is the mechanism that handles it. XMLHTTP is the JavaScript object that implements it. DHTML is the mechanism that allows JavaScript to update the DOM. Each of these technologies has a name and does something. You can't just ignore the background server data transfer, leave the second half and let it be AJAX.
Some people will say it's close enough and so it doesn't matter. But they're wrong. VBScript and JavaScript are related. But people don't call one the other. PHP and Perl are related, but different. JavaScript happens to be a mechanism in AJAX. The terms aren't interchangeable. And misusing the term AJAX dilutes the value of the word.
STEWART: Here's just what I wanted to tell you guys.
CARLSON: Yes.
STEWART: Stop.
(LAUGHTER)
STEWART: Stop, stop, stop, stop hurting America.
/Rant over. - pbjorge12, on 10/12/2007, -2/+12With Opera 9.0 go to View->Source
Make your changes and click reload from cache... - b7illsmith, on 10/12/2007, -0/+8@bpapa
Give the Web Developer extension another look. It will do everything you mentioned in your post (and then some) except the part about going "down for awhile". :)
https://addons.mozilla.org/firefox/60/ - lowerlogic, on 10/12/2007, -0/+7Thats not in real time.
- catoutfit, on 10/12/2007, -1/+5phytar, I agree with what you're saying but why not just use an on keypress event attatched to the textarea instead of a 'loop', much friendlier on the CPU
- bpapa, on 10/12/2007, -0/+4The Developer extension is great but sometimes you want to try and isolate HTML and see what happens quickly. This is great for something like this.
I actually preferred this one site rendur.com because it had a seperate editor for HTML and CSS. But that has been down for awhile. - thomashallock, on 10/12/2007, -0/+3<textarea onKeyDown='document.getElementById("preview").innerHTML = this.value'></textarea>
<div id = 'preview' ></div> - inactive, on 10/12/2007, -2/+5Just type the HTML code in the textarea , and it will magically (if AJAX was the name of a wizard) APPEAR in the frame below. - excerpt from the description made by the owner of the website. Sorry :(
- Canute, on 10/12/2007, -0/+3Not really, if you look at the html it's exactly the same as the other site. Duggmirror doesn't have editbox.html and frameing after divs and tables doesn't really make any sense.
- speaker219, on 10/12/2007, -1/+3MIRROR:
Sorry to top post, but I made a mirror and wanted as much people to see it as possible.
http://charlie.untitled1.ca/html/
And, for the record, it's not ajax at all. - cybertron3, on 10/12/2007, -0/+2Sep 23, 2006 4:49 PM (California time)
Hello,
I just had to disable your site squarefree.com as it's coming under some
load and spawning countless php processes that are crashing the
webserver. I wasn't able to figure out exactly what's going on, as
leaving it up for more than a minute pretty much toasts the server.
Please don't re-enable it until you've figured out what's going on, or
disabled any possibly problematic php.
Thanks,
James
----------------------------------
HA! I know exactly what happened ;) - fenris6644, on 10/12/2007, -0/+2Yet another misuse of the ever-hyped term known as AJAX. Marked as "inaccurate"... there must really be some morons on digg if this made it to the home page.
- MrSunshine, on 10/12/2007, -0/+2Hrm... yeah, this was 4 years ago. Might want to install the StumbleUpon toolbar to find such websites without relying on Digg.
- DeusMachinae, on 10/12/2007, -0/+2Now it says:
"htmledit is down while i try to figure out why is was causing wordpress to crash my (shared!) web server."
Obvously, the author is not aware of the digg effect! - b2drb, on 10/12/2007, -0/+2@chrizel: didn't know that one, like it :)
- mixd, on 10/12/2007, -0/+2how did this get dugg
- thomashallock, on 10/12/2007, -1/+3@catoutfit: Some edit actions aren't considered keypresses, e.g. "pasting". Yes it's marginally harder on the processor, but not so much as to make a noticeable perform ace hit. On Digg's, "preview your submission" thing when you go to submit a new story you'll see that they use a loop instead of onkeydown... for this reason I suppose.
- skinrock, on 10/12/2007, -1/+3Great, another ill-informed post claiming something is "ajax". Listen, the "x" stands for XML, using javascript to update another section doesn't require XML, such as in this case, and therefore...no "x", no "ajax". See, you have to make an XMLHttpRequest to the server, and you use JavaScript to parse the response...tada, now you have AJAX.
- eznihm, on 10/12/2007, -0/+2Different, but same:
http://digg.com/programming/Real_time_CSS_Editor - SilentBobSC, on 10/12/2007, -0/+2sigh... it's not AJAX...
- thomashallock, on 10/12/2007, -0/+2I also thought AJAX referred to sending requests to the server and updating the current page with the response. Everything happening in this editor is client-side; it's just injecting the the bottom div with the value of the top textarea on every keystroke (see my post below.)
- bcreavis, on 10/12/2007, -0/+1There is nothing too "magical" about this editor. All it is is elementary javascript.
Thanks altintx and skinrock for clearing up the "oooo AJAX!" trend a bit for us. :) Just because content changes before your eyes without the browser window refreshing, doesn't mean it's AJAX. - thomashallock, on 10/12/2007, -0/+1@skinrock: Well, that might work, but it would be absurdly complicated considering the ilne method I just posted. I'd rather leave the parsing to the browser. Just wondering, what sort of usability issues would I run in to?
- thomashallock, on 10/12/2007, -0/+1Want to make one yourself? It's as simple as taking a field's value and injecting it into a div using innerHTML on every keystroke. Save this bit to a file and open it in your browser:
- inactive, on 10/12/2007, -0/+1Not Found
The requested URL /htmledit/ was not found on this server.
Additionally, a 404 Not Found error was encountered while trying to use an ErrorDocument to handle the request.
=( - aptiva, on 10/12/2007, -3/+4Wtf were you using this for!?
- Rayor, on 10/12/2007, -0/+1Is there a way to unbury something? I accidentally marked this story as inaccurate when I meant to bury a different story.
- inactive, on 10/12/2007, -0/+1pretty cool
- Iknockstuffdown, on 10/12/2007, -0/+1This is one of the coolest things I've seen in a while
- bpapa, on 10/12/2007, -0/+1Oh yeah, I definately use the web developer extension all of the time. It has shaved HOURS off of my work time. But, sometimes you just think to yourself "how will this look" without wanting to see it in the scope of a complex page. For something like that, tools like this site and rendur are great. I suppose you could do the same thing in firefox by opening a new tab and leaving itt empty... maybe?
- 6dust, on 10/12/2007, -0/+1LOL... Lame! Look at this comment from the webmaster if you browse to the server root:
Sep 23, 2006 4:49 PM (California time)
Hello,
I just had to disable your site squarefree.com as it's coming under some
load and spawning countless php processes that are crashing the
webserver. I wasn't able to figure out exactly what's going on, as
leaving it up for more than a minute pretty much toasts the server.
Please don't re-enable it until you've figured out what's going on, or
disabled any possibly problematic php.
Thanks,
James - erikuma, on 10/12/2007, -0/+1I agree! There is no use of XMLHTTPRequest in this article. It's too OLD.
I definitely bury this. - SilentBobSC, on 10/12/2007, -0/+1I'm suprised it hasn't been labeled as Web 2.0....
- joshiesurber, on 10/12/2007, -0/+1This isn't even useful! Save a file on your computer and you can use Vim (or a lesser editor) and just refresh your page, and have all the features you are used to (like tag completion and the such)
Not to mention that updating on every keystroke fills your browser's history with all sorts of cruft. No thanks. - skinrock, on 10/12/2007, -1/+1Actually it's not that simple. innerHTML is not the true way to do it, if anything, you should be parsing out the text and appending the nodes to the DOM manually. innerHTML will for the most part show up right, but you might run into issues, especially with usability (not that you would interact with it, just a point though).
- skinrock, on 10/12/2007, -0/+0Ya, removing the slash from the end will do that.
- allatti2d, on 10/12/2007, -1/+1ugh... I feel so OLD!!!!!!!
- skinrock, on 10/12/2007, -0/+0I've found issues with anchor tags, like onclick events and classes not working right unless I append it to the dom. Seems like innerHTML just kind of paints it to the screen, where as using the DOM actually builds it out. I don't know if that's the exact definition, but that's what I've experienced.
- yogastore, on 06/30/2008, -0/+0http://astore.amazon.com/la.crosse.atomic.clock-20
http://astore.amazon.com/la.crosse.technology.wire ...
http://astore.amazon.com/upright.bagless.vacuum-20
http://astore.amazon.com/dyson.upright.vacuum-20
http://astore.amazon.com/hoover.bagless-20
http://astore.amazon.com/hoover.canister-20
http://astore.amazon.com/pyrex.storage-20
http://astore.amazon.com/pyrex.storage.lids-20
http://astore.amazon.com/inflatable.bed-20
http://astore.amazon.com/aerobed.inflatable.bed-20 - bmharris, on 10/12/2007, -1/+1you obviously don't see much
- inactive, on 10/12/2007, -3/+3Lol it got owned before duggmirror got to it? http://duggmirror.com/programming/Real_Time_HTML_editor/
- neftaly, on 10/12/2007, -1/+0This is pretty lame. Why use AJAX? http://web.archive.org/web/20040210065310/neftaly.com/eed/ (made for my little sister a couple of years ago).
- tehsexy, on 10/12/2007, -4/+2The description below the title doesn't make any sense.
- allatti2d, on 10/12/2007, -3/+1I get nothing at the mirror!
Feeling like a piece of candy just got whipped away from me at the last minute... :( - kourge, on 10/12/2007, -4/+2This one is really old and I've been using this for over a year.
-
Show 51 - 54 of 54 discussions

What is Digg?
Browsing Digg on your phone just got easier with our enhancements to the