 Javascript issues |
  |
| Brian Chandler |
 Jul 7 2021, 03:07 AM
Post
#1
|
|
Jocular coder  Group: Members Posts: 2,460 Joined: 31-August 06 Member No.: 43  |
The big question, of course, is where is the real specification/manual for JS? Or does it have one? Is it like Topsy/ Are there just various manufacturers' interpretations of what thing were prbably meant to mean? But more practically...
*1* I want to add an 'onload' handler to a page, to fire the js which reads the current basket from a cookie and displays it. I can do this of course by the usual method of writing "onload={javascript text}" in the html body tag, but this means manual editing of a couple of hundred pages, so I tried to add it using javascript. Here's an example (everything is a work in progress...): Page: [https://imaginatorium.com/conan.html] java script: [https://imaginatorium.com/js/base.js] Unfortunately, since this javascript is running when it gets loaded, in the html head tag, on the console (in Firefox at least) this gives an error message: "TypeError: document.body is null" - so presumably until the browser gets to the <body> tag, this can't be used. And I can't see any other immediate way to attach it. Any suggestions? *2* If you play around with the "add to basket" buttons, you should soon get things like "Basket: 2 items", but you will also soon get "Basket: 222 items", because js can happily add 1 and 1 to get either 2 or 11 (because '+' is an overloaded operator for both addition and string concatenation). AIUI, there is no (cast) operator ("We don't need no stinking type stuff..."), but there is a function Number() which generates a number always. What is the best strategy? Just Number() everything?? |
  |
 
|
| Christian J |
Jul 7 2021, 04:48 AM
Post
#2
|
|
. Group: WDG Moderators Posts: 9,653 Joined: 10-August 06 Member No.: 7 |
QUOTE(Brian Chandler @ Jul 7 2021, 10:07 AM)  The big question, of course, is where is the real specification/manual for JS? Or does it have one? Is it like Topsy/ Are there just various manufacturers' interpretations of what thing were prbably meant to mean? But more practically... The official name is ECMA-script, which has a spec that I've never read: https://262.ecma-international.org/12.0/ QUOTE *1* I want to add an 'onload' handler to a page, to fire the js which reads the current basket from a cookie and displays it. I can do this of course by the usual method of writing "onload={javascript text}" in the html body tag, but this means manual editing of a couple of hundred pages, so I tried to add it using javascript. Here's an example (everything is a work in progress...): Page: [https://imaginatorium.com/conan.html] java script: [https://imaginatorium.com/js/base.js] Unfortunately, since this javascript is running when it gets loaded, in the html head tag, on the console (in Firefox at least) this gives an error message: "TypeError: document.body is null" - so presumably until the browser gets to the <body> tag, this can't be used. And I can't see any other immediate way to attach it. Any suggestions? Maybe the ASYNC and DEFER attributes can help, but I have no personal experience: https://flaviocopes.com/javascript-async-defer/ onload events can also be more practically detected from window.addEventListener, since you can use multiple onload events on the same page. Instead of onload you can also use onDOMContentLoaded, which might be faster since it fires when all static HTML is loaded (but not external files like images, etc): CODE function foo() { alert('Hello world'); } window.addEventListener('DOMContentLoaded', foo, false); (note that the "on" part in "onDOMContentLoaded" or "onload" is omitted for some reason). You can also write anonymous functions for more portability: CODE window.addEventListener('load', function() { alert('Hello world'); }, false); Not sure exactly what the "false" part at the end does, maybe the linked page explains it. QUOTE *2* If you play around with the "add to basket" buttons, you should soon get things like "Basket: 2 items", but you will also soon get "Basket: 222 items", because js can happily add 1 and 1 to get either 2 or 11 (because '+' is an overloaded operator for both addition and string concatenation). AIUI, there is no (cast) operator ("We don't need no stinking type stuff..."), but there is a function Number() which generates a number always. What is the best strategy? Just Number() everything?? I suppose that could work. I usually multiply the value with 1 to force type conversion to number (you may have to do it in several places sometimes). |
|
|
|
| Brian Chandler |
Jul 7 2021, 11:02 PM
Post
#3
|
|
Jocular coder Group: Members Posts: 2,460 Joined: 31-August 06 Member No.: 43 |
Thanks Christian...
The 'defer' thing is simple and seems to work well. I worry a bit about the 0.something percent, but it looks as though you would need to have >10 yr old browser. But perhaps I should look at using the eventlistener, because that would presumably work even before the DOM has been created. (You really would think that the basic HTML object would have HEAD and BODY ab initio...) And the "+" problem; of course I had missed where I was getting the number from the cookie string. The ECMA thing looks as though it was written for lawyers; no search hits for "operator precedence" for example, but it's there in 13.15.3: 1+'2' = '12'. What a criminally stupid decision. |
|
|
|
| Christian J |
Jul 11 2021, 03:40 AM
Post
#4
|
|
. Group: WDG Moderators Posts: 9,653 Joined: 10-August 06 Member No.: 7 |
There's also window.onload, of course.
|
|
|
|
|
2 User(s) are reading this topic (2 Guests and 0 Anonymous Users)
0 Members:
|
Lo-Fi Version | Time is now: 19th April 2024 - 07:18 PM |
Invision Power Board
© 2024 IPS, Inc.
Licensed to: HTMLHelp.com, LLC