JavaScript Starter Framework Errors

Question

Hi,

I am trying to learn more about JavaScript and I am messing around with... stuff. Could someone tell me why I am getting errors in my script please.

// Effects object
var effects = {
 // Display an object
 show : function(obj) {
  obj.style.display = 'block';
 },
 // Hide an object
 hide : function(obj) {
  obj.style.display = 'hide'; 
 },
 // Toggle
 toggle : function(obj) {
  if (obj instanceof Array) {
   alert('array');
  } else {
   alert('single'); 
  }
 }
}

// Selector Class
var s = {
 id : function(name) {
  return document.getElementById(name);
 },
 class : function(name) {
  node = document.getElementsByTagName("body")[0];
  var a = [];
  var re = new RegExp('\\b' + classname + '\\b');
  var els = node.getElementsByTagName("*");
  for(var i=0,j=els.length; i<j; i++)
   if(re.test(els[i].className))
    a.push(els[i]);
  return a;
 }
}

window.onload = function() {
 s.id('toggle-content').onClick(function() {
  effects.toggle(s.class('hidden-content'));
 });
}

I get the following errors:

When page loads:

Error: s.id("toggle-content").onClick is not a function Source File: http://localhost/cms/web/js/admin.js Line: 40

On a slight tangent. Is there a standardised way to get a class from the dom?

Solved.

onclick= instead of onClick()

Answer 1

Event names in Javascript don't follow the camelCase style of properties and methods. They're all lower case. Change onClick to onclick and you should be good to go.

On your slight tangent, some browsers already support getElementsByClassName (which I think is what you're asking for). There are alternatives for browsers that don't support it.