Javascript in posts on Blogger’s Home View

If you use javascript to alter a document element on a post, that post may not appear the same in the Blog Home View.

Look at the posts BELOW THIS ONE in my Blog home view at http://joecodeswell.blogspot.com/. Notice that the last item in the post for Friday, February 18, 2011 at 3:25 PM says: “Javascript: $1,000,000.00”. While the last items for the posts at [3:23 PM, 3:18 PM, 1:20 PM, and 1:03 PM] read “this is first”. Note that as these posts slip farther into “Older Posts“, it will be the first post on that HTML page that says “Javascript: $1,000,000.00”.

Click on any of the “this is first” posts, to go to the post page itself. Notice that the last item on the post page does NOT read “this is first”. Instead it reads “Javascript: $1,000,000.00”. What’s going on here?

Here’s what’s going on. When you publish a post, it gets its own html page. Then that page gets rolled up into the Blog Home View, which is itself a page with one single element. All the other post pages get stripped of their , , , etc. elements and get put under a

element with, as noted, a unique id number. Look for yourself by viewing the Page Source of my Blog Home View.

Notice that there are several

elements in the Page Source. THAT’S A PROBLEM. The id attribute for should be unique. (Not the same for the class attribute.) The javascript changes just the first one it encounters. So that’s the reason for the behaviour we see.

Fixing this problem requires us to make a unique id for each paragraph to be altered by javascript, in each post.

There’s another problem that exists. There are many instances of the same javascript function named writeJSo in the Blog Home View. This is because each of the individual posts, contained that function. Initially, we’ll solve this problem in a brute force, similar manner to the above. We’ll give each instance of writeJso a unique name, and make it refer to the unique paragraph id in each post.

Note that when I wrote writeJSo immediately followed by ‘()’ parentheses, the function RAN in THIS POST, while I was using Compose with Post Options [Use
tags, Show HTML literally]. Somehow a div with an id of joejso was inserted into this post, I guess when I was editing HTML directly. VERY STRANGE. 🙂

We can see the result of these changes by inspecting the 3 posts that appear ABOVE THIS ONE in my Blog Home View. PLEASE NOTE if you were using IE when I first published these posts, you didn’t see “Javascript: $1,000,000.00” in any posts below this because I used  which IE does NOT recognize. I have since changed the element to .

Advertisements

Leave a Reply

Fill in your details below or click an icon to log in:

WordPress.com Logo

You are commenting using your WordPress.com account. Log Out / Change )

Twitter picture

You are commenting using your Twitter account. Log Out / Change )

Facebook photo

You are commenting using your Facebook account. Log Out / Change )

Google+ photo

You are commenting using your Google+ account. Log Out / Change )

Connecting to %s