javascript – Can't call functions inside a function

Question:

I decided for myself to understand the simple principle of jQuery and ran into a problem. When I try to organize a simplified version of the library, I cannot call the functions that lie inside the function. Code example:

var jQ = function(el) {
   this.el = document.getElementById(el);
}

jQ.prototype.html = function(text){
  this.el.innerHTML = text;
  return this;
}

jQ.prototype.css = function(key, value){
  this.el.style[key] = value;
  return this;
}

// Использование 
jQ('bar').html('test');

Answer:

function extend(Child, Parent) {
    var F = function() { }
    F.prototype = Parent.prototype
    Child.prototype = new F()
    Child.prototype.constructor = Child
    Child.superclass = Parent.prototype
}

// создали базовый класс
var parent = function() {};

// создали класс
// и сделали его потомком базового
var jQ = function(el) {
   this.el = document.getElementById(el);
}
extend(jQ, parent);

// добавили в класс parent методы и свойства
parent.prototype.html = function(text){
    this.el.innerHTML = text;
    return this;
};   
parent.prototype.css = function(key, value){
    this.el.style[key] = value;
    return this;
};



// Использование 
var element = new jQ('bar');
element.html('test');

You can read more about inheritance here:

https://learn.javascript.ru/class-inheritance

http://javascript.ru/tutorial/object/inheritance

Scroll to Top