Develop Reference

Saving result of function (which is inside an event listener) to new variable

So I want to access the result of a function that is triggerd by clicking a button. Right now, the result of the function, named CalculaIMC, is shown in an alert, but I'd like to do something else with it, so I tried storing it in a new variable, named result, but it doesn't work. Can anyone help me? Thanks.
function calculaIMC (peso, altura){
imc = peso/(altura * altura) * 10000
if(imc <= 18.5){
return `Tu IMC es ${imc.toFixed(1)}, lo que se considera un peso insuficiente, por debajo del IMC mínimo de 18.5`
}else if(imc > 18.5 && imc <=24.9){
return `Tu IMC es ${imc.toFixed(1)}, lo que se considera un peso normal`
}else if(imc > 24.9 && imc <=26.9){
return `Tu IMC es ${imc.toFixed(1)}, lo que se considera un sobrepeso de grado 1`
}else if(imc > 26.9 && imc <=29.9){
return `Tu IMC es ${imc.toFixed(1)}, lo que se considera un sobrepeso de grado 2`
}else if(imc > 29.9 && imc <=34.9){
return `Tu IMC es ${imc.toFixed(1)}, lo que se considera una obesidad de grado 1`
}else if(imc > 34.9 && imc <=39.9){
return `Tu IMC es ${imc.toFixed(1)}, lo que se considera una obesidad de grado 2`
}else if(imc > 39.9 && imc <=49.9){
return `Tu IMC es ${imc.toFixed(1)}, lo que se considera obesidad mórbida`
}else if(imc > 49.9){
return `Tu IMC es ${imc.toFixed(1)}, lo que se considera obesidad extrema`
}else{
return `Ha habido un error con los datos. Por favor, introduce tu peso en centímetros y tu altura en kilos. Utiliza un punto para separar las decimales (por ejemplo: 72.5)`
}
}
const botonInfo = document.querySelector("#begin")
botonInfo.addEventListener("click", () => {
var getPeso = parseFloat (prompt("Introduce tu peso en kilos"))
var getAltura = parseFloat (prompt("Introduce tu altura en centímetros"))
alert (calculaIMC(getPeso,getAltura))
console.log(calculaIMC (getPeso,getAltura))
})
var result = calculaIMC(getPeso,getAltura)//this doesn't work.

On your last line of code you're trying to use the variables getPeso and getAltura, which don't exist in that scope. (They exist inside of a function, but not outside of that function.)
Ignoring the event handler for the moment, since you're trying to calculate a result immediately upon loading the page... You essentially just forgot to define and initialize those two values. Define them before using them:
function calculaIMC (peso, altura){
imc = peso/(altura * altura) * 10000
if(imc <= 18.5){
return `Tu IMC es ${imc.toFixed(1)}, lo que se considera un peso insuficiente, por debajo del IMC mínimo de 18.5`
}else if(imc > 18.5 && imc <=24.9){
return `Tu IMC es ${imc.toFixed(1)}, lo que se considera un peso normal`
}else if(imc > 24.9 && imc <=26.9){
return `Tu IMC es ${imc.toFixed(1)}, lo que se considera un sobrepeso de grado 1`
}else if(imc > 26.9 && imc <=29.9){
return `Tu IMC es ${imc.toFixed(1)}, lo que se considera un sobrepeso de grado 2`
}else if(imc > 29.9 && imc <=34.9){
return `Tu IMC es ${imc.toFixed(1)}, lo que se considera una obesidad de grado 1`
}else if(imc > 34.9 && imc <=39.9){
return `Tu IMC es ${imc.toFixed(1)}, lo que se considera una obesidad de grado 2`
}else if(imc > 39.9 && imc <=49.9){
return `Tu IMC es ${imc.toFixed(1)}, lo que se considera obesidad mórbida`
}else if(imc > 49.9){
return `Tu IMC es ${imc.toFixed(1)}, lo que se considera obesidad extrema`
}else{
return `Ha habido un error con los datos. Por favor, introduce tu peso en centímetros y tu altura en kilos. Utiliza un punto para separar las decimales (por ejemplo: 72.5)`
}
}
var getPeso = parseFloat (prompt("Introduce tu peso en kilos"))
var getAltura = parseFloat (prompt("Introduce tu altura en centímetros"))
var result = calculaIMC(getPeso,getAltura)//this does work.
console.log(result);
UPDATE: Based on comments, it sounds like what you want is still to calculate the value in response to a button click, you just want the value available in global scope so you can use it for other purposes later.
You already have the part about defining the value in global scope:
var result = calculaIMC(getPeso,getAltura)
But if you don't want to calculate the value there, then don't calculate the value there:
var result;
Simply update the value in the function:
result = calculaIMC(getPeso,getAltura)
Then you can use that value later. For example:
function calculaIMC (peso, altura){
imc = peso/(altura * altura) * 10000
if(imc <= 18.5){
return `Tu IMC es ${imc.toFixed(1)}, lo que se considera un peso insuficiente, por debajo del IMC mínimo de 18.5`
}else if(imc > 18.5 && imc <=24.9){
return `Tu IMC es ${imc.toFixed(1)}, lo que se considera un peso normal`
}else if(imc > 24.9 && imc <=26.9){
return `Tu IMC es ${imc.toFixed(1)}, lo que se considera un sobrepeso de grado 1`
}else if(imc > 26.9 && imc <=29.9){
return `Tu IMC es ${imc.toFixed(1)}, lo que se considera un sobrepeso de grado 2`
}else if(imc > 29.9 && imc <=34.9){
return `Tu IMC es ${imc.toFixed(1)}, lo que se considera una obesidad de grado 1`
}else if(imc > 34.9 && imc <=39.9){
return `Tu IMC es ${imc.toFixed(1)}, lo que se considera una obesidad de grado 2`
}else if(imc > 39.9 && imc <=49.9){
return `Tu IMC es ${imc.toFixed(1)}, lo que se considera obesidad mórbida`
}else if(imc > 49.9){
return `Tu IMC es ${imc.toFixed(1)}, lo que se considera obesidad extrema`
}else{
return `Ha habido un error con los datos. Por favor, introduce tu peso en centímetros y tu altura en kilos. Utiliza un punto para separar las decimales (por ejemplo: 72.5)`
}
}
var result;
const botonInfo = document.querySelector("#begin")
botonInfo.addEventListener("click", () => {
var getPeso = parseFloat (prompt("Introduce tu peso en kilos"))
var getAltura = parseFloat (prompt("Introduce tu altura en centímetros"))
result = calculaIMC(getPeso,getAltura)
})
document.querySelector("#test").addEventListener("click", () => {
console.log(result);
})
<button id="begin">begin</button>
<button id="test">test</button>

Uncaught (in promise) TypeError: d is not a function - tensorflow js

i'm trying to do a prediction with tensorflow js, but when I try to predict have de following error:
Uncaught (in promise) TypeError: d is not a function
at tfjs#latest:17:162006
at tfjs#latest:17:159769
at e.t.scopedRun (tfjs#latest:17:159898)
at e.t.tidy (tfjs#latest:17:159666)
at n (tfjs#latest:17:161982)
at tfjs#latest:17:162468
at e.t.scopedRun (tfjs#latest:17:159898)
at e.t.runKernelFunc (tfjs#latest:17:162190)
at slice_ (slice.js:177:17)
at slice (operation.js:45:22)
This is my javascript code:
<script>
async function inicializar() {
alert("estoy en inicialize");
document.getElementById('prediccion').addEventListener('click', () => predecir());
};
async function predecir() {
alert("estoy en predecir"); //Mensaje para chequear que entre aca
const modelo = await tf.loadLayersModel('trained-model/model.json');
const canvas = document.getElementById('output');
alert(canvas);// Mensaje para ver si lee canvas como elemento HTML
let tensorImg = tf.browser.fromPixels(canvas).resizeNearestNeighbor([150, 150]).toFloat().expandDims();
alert("pasa esto"); //Mensaje para chequear que entre aca
alert(tensorImg); //Mensaje para ver si lee el tensor de la imagen
prediction = modelo.predict(tensorImg).data(); //Aca me da error!!!!! TypeError: d is not a function
alert("pase hasta aca"); //Mensaje para chequear que entre aca, pero no llega
var respuesta;
if (prediction <= .5) {
respuesta = "Gato";
} else {
respuesta = "Perro";
}
document.getElementById("prediccion").innerHTML = respuesta;
};
inicializar()
</script>
Thanks for your help!

Show more text after a <p></p> field

I have a script to show more text but in my structure Show more link comes just after the text.
What i want that Show more text must come just at the end of the text. As ı will be using Tinymce to create the text i can not make changes at the text part.
How i can show"... Show More" is on this image
My example is on Show More Example
Here is my HTML/JavaScript
document.addEventListener('DOMContentLoaded', function() {
new ShowMore('example-1', {
more: ' ... Show more',
less: ' Show less'
})
});
//showMore.min.js
var ShowMore = (function() {
function m(c, a) {
var d = a.type,
b = a.more;
a = a.less;
this.className = c;
this.i = d || "span";
this.more = b;
this.less = a;
this.showMore = '<b class="show-more show-more-button same" aria-label="expand" tabindex="0">' + b + "</b>";
this.showLess = '<b class="show-less show-more-button same" aria-label="collapse" tabindex="0">' + a + "</b>";
this.regex = {
c: /[^\x20-\x7E]/gm,
h: /\s{2,}/gm,
f: /<\s*\/?br\s*[/]?>/gm
};
this.m();
}
m.prototype.m = function() {
for (var c = document.querySelectorAll("." + this.className), a = 0; a < c.length; a++) {
var d = c[a].getAttribute("data-number"),
b = c[a].getAttribute("data-after"),
e = c[a].getAttribute("data-type");
this.j(e, c[a], +d, +b);
}
};
m.prototype.j = function(c, a, d, b) {
a.setAttribute("aria-expanded", "false");
b = d + b;
if ("text" === c) {
var e = a.innerHTML;
var f = e.replace(this.regex.c, "").replace(this.regex.h, " ").replace(this.regex.f, "").length - a.innerText.replace(this.regex.c, "").length;
a.innerText.length > b &&
((f = e
.replace(this.regex.c, "")
.replace(this.regex.h, " ")
.replace(this.regex.f, " ")
.substr(0, d + f)),
(f = f.substr(0, Math.min(f.length, f.lastIndexOf(" ")))),
(a.innerHTML = f),
this.b({
type: c,
element: a,
l: e,
o: f
}));
}
if ("list" === c && ((e = [].slice.call(a.children)), e.length > b)) {
for (f = d; f < e.length; f++) e[f].classList.add("hidden");
this.b({
type: c,
element: a,
g: d
});
}
if ("table" === c && ((e = a.rows), e.length > b)) {
for (b = d; b < e.length; b++) e[b].classList.add("hidden");
this.b({
type: c,
element: a,
g: d
});
}
};
m.prototype.b = function(c) {
var a = this,
d = c.type,
b = c.element,
e = c.g,
f = c.l,
n = c.o;
"table" === d ? (b.insertAdjacentHTML("afterend", this.showMore), (c = b.nextElementSibling)) : ((c = document.createElement(this.i)), (c.innerHTML = this.showMore), b.appendChild(c), (c = b));
c.addEventListener("click", function(k) {
var h = k.currentTarget;
k = k.target;
var g = "table" === d ? h.previousElementSibling.getAttribute("aria-expanded") : h.getAttribute("aria-expanded");
if ("text" === d && k.classList.contains("show-more-button")) {
b.innerHTML = "";
b.innerHTML = "false" === g ? f : n;
var l = document.createElement(a.i);
l.insertAdjacentHTML("beforeend", "false" === g ? a.showLess : a.showMore);
"true" === g ? a.a(b, k, a.more, d, !1) : a.a(b, k, a.less, d, !0);
b.appendChild(l);
}
if ("list" === d && k.classList.contains("show-more-button"))
for (h = [].slice.call(h.children), l = 0; l < h.length; l++)
"false" === g && (h[l].classList.remove("hidden"), a.a(b, k, a.less, d, !0)), "true" === g && l >= e && l < h.length - 1 && (h[l].classList.add("hidden"), a.a(b, k, a.more, d, !1));
if ("table" === d)
if (((h = b.rows), "false" === g)) {
for (g = 0; g < h.length; g++) h[g].classList.remove("hidden");
a.a(b, k, a.less, d, !0);
} else {
for (g = e; g < h.length; g++) h[g].classList.add("hidden");
a.a(b, k, a.more, d, !1);
}
});
};
m.prototype.a = function(c, a, d, b, e) {
b = "table" === b ? b : "the " + b;
var f = e ? "collapse" : "expand";
c.setAttribute("aria-expanded", e);
a.innerHTML = d;
a.setAttribute("aria-label", f + " " + b);
};
return m;
})();
<div class="container">
<section id="example-text">
<h2>More text</h2>
<div class="example-1" data-type="text" data-number="500" data-after="1">
<p><strong>Porque é que o usamos?</strong></p>
<p>É um facto estabelecido de que um leitor é distraído pelo conteúdo legível de uma página quando analisa a sua mancha gráfica. Logo, o uso de Lorem Ipsum leva a uma distribuição mais
ou menos normal de letras, ao contrário do uso de "Conteúdo aqui, conteúdo aqui", tornando-o texto legível. Muitas ferramentas de publicação electrónica e editores de páginas web usam actualmente
o Lorem Ipsum como o modelo de texto usado por omissão, e uma pesquisa por "lorem ipsum" irá encontrar muitos websites ainda na sua infância. Várias versões têm evoluído ao longo dos anos, por vezes
por acidente, por vezes propositadamente (como no caso do humor).</p>
<p><strong>O que é o Lorem Ipsum?</strong></p>
<p>O Lorem Ipsum é um texto modelo da indústria tipográfica e de impressão. O Lorem Ipsum tem vindo a ser o texto padrão usado por estas indústrias desde o ano de 1500, quando uma misturou os caracteres de
um texto para criar um espécime de livro. Este texto não só sobreviveu 5 séculos, mas também o salto para a tipografia electrónica, mantendo-se essencialmente inalterada. Foi popularizada nos anos 60 com
a disponibilização das folhas de Letraset, que continham passagens com Lorem Ipsum, e mais recentemente com os programas de publicação como o Aldus PageMaker que incluem versões do Lorem Ipsum.</p>
<p><strong>De onde é que ele vem?</strong></p>
<p>Ao contrário da crença popular, o Lorem Ipsum não é simplesmente texto aleatório. Tem raízes numa peça de literatura clássica em Latim, de 45 AC, tornando-o com mais de 2000 anos. Richard McClintock,
um professor de Latim no Colégio Hampden-Sydney, na Virgínia, procurou uma das palavras em Latim mais obscuras (consectetur) numa passagem Lorem Ipsum, e atravessando as cidades do mundo na literatura clássica, descobriu a
sua origem. Lorem Ipsum vem das secções 1.10.32 e 1.10.33 do "de Finibus Bonorum et Malorum" (Os Extremos do Bem e do Mal), por Cícero, escrito a 45AC. Este livro é um tratado na teoria da ética, muito popular
durante a Renascença. A primeira linha de Lorem Ipsum, "Lorem ipsum dolor sit amet..." aparece de uma linha na secção 1.10.32.</p>
<p>O pedaço mais habitual do Lorem Ipsum usado desde os anos 1500 é reproduzido abaixo para os interessados. As secções 1.10.32 e 1.10.33 do "de Finibus Bonorum et Malorum" do Cícero também estão reproduzidos
na sua forma original, acompanhados pela sua tradução em Inglês, versões da tradução de 1914 por H. Rackham.</p>
</div>
</section>
</div>

here is the idea to turn the last <p> to an inline element at screen so the More/less button can stand right behind the text.:
from earlier comment:
A quick fix is to try to set the last p as an inline box div.example-1 p:last-of-type{display:inline;} , the best would be to append that link to that last p seen instead inserting it behind ;) demo https://codepen.io/gc-nomade/pen/YzGraQV – G-Cyrillus 25 mins ago
document.addEventListener('DOMContentLoaded', function() {
new ShowMore('example-1', {
more: ' ... Show more',
less: ' Show less'
})
});
//showMore.min.js
var ShowMore = (function() {
function m(c, a) {
var d = a.type,
b = a.more;
a = a.less;
this.className = c;
this.i = d || "span";
this.more = b;
this.less = a;
this.showMore = '<b class="show-more show-more-button same" aria-label="expand" tabindex="0">' + b + "</b>";
this.showLess = '<b class="show-less show-more-button same" aria-label="collapse" tabindex="0">' + a + "</b>";
this.regex = {
c: /[^\x20-\x7E]/gm,
h: /\s{2,}/gm,
f: /<\s*\/?br\s*[/]?>/gm
};
this.m();
}
m.prototype.m = function() {
for (var c = document.querySelectorAll("." + this.className), a = 0; a < c.length; a++) {
var d = c[a].getAttribute("data-number"),
b = c[a].getAttribute("data-after"),
e = c[a].getAttribute("data-type");
this.j(e, c[a], +d, +b);
}
};
m.prototype.j = function(c, a, d, b) {
a.setAttribute("aria-expanded", "false");
b = d + b;
if ("text" === c) {
var e = a.innerHTML;
var f = e.replace(this.regex.c, "").replace(this.regex.h, " ").replace(this.regex.f, "").length - a.innerText.replace(this.regex.c, "").length;
a.innerText.length > b &&
((f = e
.replace(this.regex.c, "")
.replace(this.regex.h, " ")
.replace(this.regex.f, " ")
.substr(0, d + f)),
(f = f.substr(0, Math.min(f.length, f.lastIndexOf(" ")))),
(a.innerHTML = f),
this.b({
type: c,
element: a,
l: e,
o: f
}));
}
if ("list" === c && ((e = [].slice.call(a.children)), e.length > b)) {
for (f = d; f < e.length; f++) e[f].classList.add("hidden");
this.b({
type: c,
element: a,
g: d
});
}
if ("table" === c && ((e = a.rows), e.length > b)) {
for (b = d; b < e.length; b++) e[b].classList.add("hidden");
this.b({
type: c,
element: a,
g: d
});
}
};
m.prototype.b = function(c) {
var a = this,
d = c.type,
b = c.element,
e = c.g,
f = c.l,
n = c.o;
"table" === d ? (b.insertAdjacentHTML("afterend", this.showMore), (c = b.nextElementSibling)) : ((c = document.createElement(this.i)), (c.innerHTML = this.showMore), b.appendChild(c), (c = b));
c.addEventListener("click", function(k) {
var h = k.currentTarget;
k = k.target;
var g = "table" === d ? h.previousElementSibling.getAttribute("aria-expanded") : h.getAttribute("aria-expanded");
if ("text" === d && k.classList.contains("show-more-button")) {
b.innerHTML = "";
b.innerHTML = "false" === g ? f : n;
var l = document.createElement(a.i);
l.insertAdjacentHTML("beforeend", "false" === g ? a.showLess : a.showMore);
"true" === g ? a.a(b, k, a.more, d, !1) : a.a(b, k, a.less, d, !0);
b.appendChild(l);
}
if ("list" === d && k.classList.contains("show-more-button"))
for (h = [].slice.call(h.children), l = 0; l < h.length; l++)
"false" === g && (h[l].classList.remove("hidden"), a.a(b, k, a.less, d, !0)), "true" === g && l >= e && l < h.length - 1 && (h[l].classList.add("hidden"), a.a(b, k, a.more, d, !1));
if ("table" === d)
if (((h = b.rows), "false" === g)) {
for (g = 0; g < h.length; g++) h[g].classList.remove("hidden");
a.a(b, k, a.less, d, !0);
} else {
for (g = e; g < h.length; g++) h[g].classList.add("hidden");
a.a(b, k, a.more, d, !1);
}
});
};
m.prototype.a = function(c, a, d, b, e) {
b = "table" === b ? b : "the " + b;
var f = e ? "collapse" : "expand";
c.setAttribute("aria-expanded", e);
a.innerHTML = d;
a.setAttribute("aria-label", f + " " + b);
};
return m;
})();
div.example-1 p:last-of-type {
display: inline;
}
b {
color: #0095E5
}
<div class="container">
<section id="example-text">
<h2>More text</h2>
<div class="example-1" data-type="text" data-number="500" data-after="1">
<p><strong>Porque é que o usamos?</strong></p>
<p>É um facto estabelecido de que um leitor é distraído pelo conteúdo legível de uma página quando analisa a sua mancha gráfica. Logo, o uso de Lorem Ipsum leva a uma distribuição mais
ou menos normal de letras, ao contrário do uso de "Conteúdo aqui, conteúdo aqui", tornando-o texto legível. Muitas ferramentas de publicação electrónica e editores de páginas web usam actualmente
o Lorem Ipsum como o modelo de texto usado por omissão, e uma pesquisa por "lorem ipsum" irá encontrar muitos websites ainda na sua infância. Várias versões têm evoluído ao longo dos anos, por vezes
por acidente, por vezes propositadamente (como no caso do humor).</p>
<p><strong>O que é o Lorem Ipsum?</strong></p>
<p>O Lorem Ipsum é um texto modelo da indústria tipográfica e de impressão. O Lorem Ipsum tem vindo a ser o texto padrão usado por estas indústrias desde o ano de 1500, quando uma misturou os caracteres de
um texto para criar um espécime de livro. Este texto não só sobreviveu 5 séculos, mas também o salto para a tipografia electrónica, mantendo-se essencialmente inalterada. Foi popularizada nos anos 60 com
a disponibilização das folhas de Letraset, que continham passagens com Lorem Ipsum, e mais recentemente com os programas de publicação como o Aldus PageMaker que incluem versões do Lorem Ipsum.</p>
<p><strong>De onde é que ele vem?</strong></p>
<p>Ao contrário da crença popular, o Lorem Ipsum não é simplesmente texto aleatório. Tem raízes numa peça de literatura clássica em Latim, de 45 AC, tornando-o com mais de 2000 anos. Richard McClintock,
um professor de Latim no Colégio Hampden-Sydney, na Virgínia, procurou uma das palavras em Latim mais obscuras (consectetur) numa passagem Lorem Ipsum, e atravessando as cidades do mundo na literatura clássica, descobriu a
sua origem. Lorem Ipsum vem das secções 1.10.32 e 1.10.33 do "de Finibus Bonorum et Malorum" (Os Extremos do Bem e do Mal), por Cícero, escrito a 45AC. Este livro é um tratado na teoria da ética, muito popular
durante a Renascença. A primeira linha de Lorem Ipsum, "Lorem ipsum dolor sit amet..." aparece de uma linha na secção 1.10.32.</p>
<p>O pedaço mais habitual do Lorem Ipsum usado desde os anos 1500 é reproduzido abaixo para os interessados. As secções 1.10.32 e 1.10.33 do "de Finibus Bonorum et Malorum" do Cícero também estão reproduzidos
na sua forma original, acompanhados pela sua tradução em Inglês, versões da tradução de 1914 por H. Rackham.</p>
</div>
</section>
</div>
or play with position :https://codepen.io/gc-nomade/pen/JjRrLvR it sets it on the far right at bottom.

I am using a quick positioning fix to do this. Setting parent div as position:relative; and then span element position:absolute;.
document.addEventListener('DOMContentLoaded', function() {
new ShowMore('example-1', {
more: ' ... Show more',
less: ' Show less'
})
});
//showMore.min.js
var ShowMore = (function() {
function m(c, a) {
var d = a.type,
b = a.more;
a = a.less;
this.className = c;
this.i = d || "span";
this.more = b;
this.less = a;
this.showMore = '<b class="show-more show-more-button same" aria-label="expand" tabindex="0" style="position: absolute;bottom: 0;right: 0;">' + b + "</b>";
this.showLess = '<b class="show-less show-more-button same" aria-label="collapse" tabindex="0">' + a + "</b>";
this.regex = {
c: /[^\x20-\x7E]/gm,
h: /\s{2,}/gm,
f: /<\s*\/?br\s*[/]?>/gm
};
this.m();
}
m.prototype.m = function() {
for (var c = document.querySelectorAll("." + this.className), a = 0; a < c.length; a++) {
var d = c[a].getAttribute("data-number"),
b = c[a].getAttribute("data-after"),
e = c[a].getAttribute("data-type");
this.j(e, c[a], +d, +b);
}
};
m.prototype.j = function(c, a, d, b) {
a.setAttribute("aria-expanded", "false");
a.style.position = 'relative';
b = d + b;
if ("text" === c) {
var e = a.innerHTML;
var f = e.replace(this.regex.c, "").replace(this.regex.h, " ").replace(this.regex.f, "").length - a.innerText.replace(this.regex.c, "").length;
a.innerText.length > b &&
((f = e
.replace(this.regex.c, "")
.replace(this.regex.h, " ")
.replace(this.regex.f, " ")
.substr(0, d + f)),
(f = f.substr(0, Math.min(f.length, f.lastIndexOf(" ")))),
(a.innerHTML = f),
this.b({
type: c,
element: a,
l: e,
o: f
}));
}
if ("list" === c && ((e = [].slice.call(a.children)), e.length > b)) {
for (f = d; f < e.length; f++) e[f].classList.add("hidden");
this.b({
type: c,
element: a,
g: d
});
}
if ("table" === c && ((e = a.rows), e.length > b)) {
for (b = d; b < e.length; b++) e[b].classList.add("hidden");
this.b({
type: c,
element: a,
g: d
});
}
};
m.prototype.b = function(c) {
var a = this,
d = c.type,
b = c.element,
e = c.g,
f = c.l,
n = c.o;
"table" === d ? (b.insertAdjacentHTML("afterend", this.showMore), (c = b.nextElementSibling)) : ((c = document.createElement(this.i)), (c.innerHTML = this.showMore), b.appendChild(c), (c = b));
c.addEventListener("click", function(k) {
var h = k.currentTarget;
k = k.target;
var g = "table" === d ? h.previousElementSibling.getAttribute("aria-expanded") : h.getAttribute("aria-expanded");
if ("text" === d && k.classList.contains("show-more-button")) {
b.innerHTML = "";
b.innerHTML = "false" === g ? f : n;
var l = document.createElement(a.i);
l.insertAdjacentHTML("beforeend", "false" === g ? a.showLess : a.showMore);
"true" === g ? a.a(b, k, a.more, d, !1) : a.a(b, k, a.less, d, !0);
b.appendChild(l);
}
if ("list" === d && k.classList.contains("show-more-button"))
for (h = [].slice.call(h.children), l = 0; l < h.length; l++)
"false" === g && (h[l].classList.remove("hidden"), a.a(b, k, a.less, d, !0)), "true" === g && l >= e && l < h.length - 1 && (h[l].classList.add("hidden"), a.a(b, k, a.more, d, !1));
if ("table" === d)
if (((h = b.rows), "false" === g)) {
for (g = 0; g < h.length; g++) h[g].classList.remove("hidden");
a.a(b, k, a.less, d, !0);
} else {
for (g = e; g < h.length; g++) h[g].classList.add("hidden");
a.a(b, k, a.more, d, !1);
}
});
};
m.prototype.a = function(c, a, d, b, e) {
b = "table" === b ? b : "the " + b;
var f = e ? "collapse" : "expand";
c.setAttribute("aria-expanded", e);
a.innerHTML = d;
a.setAttribute("aria-label", f + " " + b);
};
return m;
})();
<div class="container">
<section id="example-text">
<h2>More text</h2>
<div class="example-1" data-type="text" data-number="500" data-after="1">
<p><strong>Porque é que o usamos?</strong></p>
<p>É um facto estabelecido de que um leitor é distraído pelo conteúdo legível de uma página quando analisa a sua mancha gráfica. Logo, o uso de Lorem Ipsum leva a uma distribuição mais
ou menos normal de letras, ao contrário do uso de "Conteúdo aqui, conteúdo aqui", tornando-o texto legível. Muitas ferramentas de publicação electrónica e editores de páginas web usam actualmente
o Lorem Ipsum como o modelo de texto usado por omissão, e uma pesquisa por "lorem ipsum" irá encontrar muitos websites ainda na sua infância. Várias versões têm evoluído ao longo dos anos, por vezes
por acidente, por vezes propositadamente (como no caso do humor).</p>
<p><strong>O que é o Lorem Ipsum?</strong></p>
<p>O Lorem Ipsum é um texto modelo da indústria tipográfica e de impressão. O Lorem Ipsum tem vindo a ser o texto padrão usado por estas indústrias desde o ano de 1500, quando uma misturou os caracteres de
um texto para criar um espécime de livro. Este texto não só sobreviveu 5 séculos, mas também o salto para a tipografia electrónica, mantendo-se essencialmente inalterada. Foi popularizada nos anos 60 com
a disponibilização das folhas de Letraset, que continham passagens com Lorem Ipsum, e mais recentemente com os programas de publicação como o Aldus PageMaker que incluem versões do Lorem Ipsum.</p>
<p><strong>De onde é que ele vem?</strong></p>
<p>Ao contrário da crença popular, o Lorem Ipsum não é simplesmente texto aleatório. Tem raízes numa peça de literatura clássica em Latim, de 45 AC, tornando-o com mais de 2000 anos. Richard McClintock,
um professor de Latim no Colégio Hampden-Sydney, na Virgínia, procurou uma das palavras em Latim mais obscuras (consectetur) numa passagem Lorem Ipsum, e atravessando as cidades do mundo na literatura clássica, descobriu a
sua origem. Lorem Ipsum vem das secções 1.10.32 e 1.10.33 do "de Finibus Bonorum et Malorum" (Os Extremos do Bem e do Mal), por Cícero, escrito a 45AC. Este livro é um tratado na teoria da ética, muito popular
durante a Renascença. A primeira linha de Lorem Ipsum, "Lorem ipsum dolor sit amet..." aparece de uma linha na secção 1.10.32.</p>
<p>O pedaço mais habitual do Lorem Ipsum usado desde os anos 1500 é reproduzido abaixo para os interessados. As secções 1.10.32 e 1.10.33 do "de Finibus Bonorum et Malorum" do Cícero também estão reproduzidos
na sua forma original, acompanhados pela sua tradução em Inglês, versões da tradução de 1914 por H. Rackham.</p>
</div>
</section>
</div>

A very quick fix would be as follows:
.example-1{
position:relative;
}
.example-1 span{
position: absolute;
right: 0;
bottom: 0;
}
There is even more quicker solution:
.example-1 p:nth-child(2){
display:inline;
}

the p tag is a block display element that's why the "show more" starts at new line, try changing it to span, I tried it on developer tools and it worked.
<div class="container">
<section id="example-text">
<h2>More text</h2>
<div class="example-1" data-type="text" data-number="500" data-after="1">
<p><strong>Porque é que o usamos?</strong></p>
<span>É um facto estabelecido de que um leitor é distraído pelo conteúdo legível de uma página quando analisa a sua mancha gráfica. Logo, o uso de Lorem Ipsum leva a uma distribuição mais
ou menos normal de letras, ao contrário do uso de "Conteúdo aqui, conteúdo aqui", tornando-o texto legível. Muitas ferramentas de publicação electrónica e editores de páginas web usam actualmente
o Lorem Ipsum como o modelo de texto usado por omissão, e uma pesquisa por "lorem ipsum" irá encontrar muitos websites ainda na sua infância. Várias versões têm evoluído ao longo dos anos, por vezes
por acidente, por vezes propositadamente (como no caso do humor).</span>
<p><strong>O que é o Lorem Ipsum?</strong></p>
<span>O Lorem Ipsum é um texto modelo da indústria tipográfica e de impressão. O Lorem Ipsum tem vindo a ser o texto padrão usado por estas indústrias desde o ano de 1500, quando uma misturou os caracteres de
um texto para criar um espécime de livro. Este texto não só sobreviveu 5 séculos, mas também o salto para a tipografia electrónica, mantendo-se essencialmente inalterada. Foi popularizada nos anos 60 com
a disponibilização das folhas de Letraset, que continham passagens com Lorem Ipsum, e mais recentemente com os programas de publicação como o Aldus PageMaker que incluem versões do Lorem Ipsum.</span>
<p><strong>De onde é que ele vem?</strong></p>
<span>Ao contrário da crença popular, o Lorem Ipsum não é simplesmente texto aleatório. Tem raízes numa peça de literatura clássica em Latim, de 45 AC, tornando-o com mais de 2000 anos. Richard McClintock,
um professor de Latim no Colégio Hampden-Sydney, na Virgínia, procurou uma das palavras em Latim mais obscuras (consectetur) numa passagem Lorem Ipsum, e atravessando as cidades do mundo na literatura clássica, descobriu a
sua origem. Lorem Ipsum vem das secções 1.10.32 e 1.10.33 do "de Finibus Bonorum et Malorum" (Os Extremos do Bem e do Mal), por Cícero, escrito a 45AC. Este livro é um tratado na teoria da ética, muito popular
durante a Renascença. A primeira linha de Lorem Ipsum, "Lorem ipsum dolor sit amet..." aparece de uma linha na secção 1.10.32.</span>
<span>O pedaço mais habitual do Lorem Ipsum usado desde os anos 1500 é reproduzido abaixo para os interessados. As secções 1.10.32 e 1.10.33 do "de Finibus Bonorum et Malorum" do Cícero também estão reproduzidos
na sua forma original, acompanhados pela sua tradução em Inglês, versões da tradução de 1914 por H. Rackham.</span>
</div>
</section>
</div>
Hope this would solve the problem.

Return Var Value In User Message

I'm new to programming and I'm currently learning JavaScript. Sorry if my code is not the most readable ever :)
I'm using this function here to calculate mortgage values (messages and business rules are in Portuguese/Brazilian standards):
function calculaFinanc() {
var amount1 = document.getElementById("amount1").value;
var amount2 = document.getElementById("amount2").value;
var teto = (amount1 / 100) * 30;
var parcela = amount2 / 360;
if (Math.round(teto) < Math.round(parcela)) {
return [document.getElementById("userMessage").className += 'alert alert-danger' , document.getElementById("userMessage").innerHTML = "<p>Você não pode financiar este imóvel. O valor da parcela de seu financiamento não poderá ultrapassar 30% valor da sua renda mensal</p>"];
} else { //... rest omitted for brevity
Inside the <p> tag in the return statement, I'd like to display the value of variables "teto" and "parcela". How on earth do I do that? No matter what I tried, it doesn't show anything (or it just displays the text "teto").
e.g. this is how I'd like to return:
return [document.getElementById("userMessage").className += 'alert alert-danger' , document.getElementById("userMessage").innerHTML = "<p>Você não pode financiar este imóvel. O valor da parcela de seu financiamento não poderá ultrapassar 30% valor da sua renda mensal ($var_teto)</p>"];

Just add it into the string.
return [document.getElementById("userMessage").className += 'alert alert-danger' , document.getElementById("userMessage").innerHTML = "<p>Você não pode financiar este imóvel. O valor da parcela de seu financiamento não poderá ultrapassar 30% valor da sua renda mensal "+teto+"</p>"];

To count number of rows in a table if the rows were created after the DOM loaded

I create rows after the DOM loaded, but I want to know how to count number of rows for eliminate the last.
I have this.
<script type="text/javascript">//Procesamiento del formulario.
$(document).ready(function(){
var cuentaTr = $('#elementos >tbody >tr').length - 1; //Cuenta el número de filas que tiene la tabla originalmente, es 1.
$('#agregar').click(function(){ //Clic en el botón que agrega nueva fila.
cuentaTr++; //Es el número de fila que le corresponde a cada una que se crea.
var nume = $('#elementos >tbody >tr >td').length; //Obtener el número de celdas
var capa = document.getElementById("elementos"); //Obtener el elemento con el id elementos
var tr = ("tr"); //Crear una tag tr
capa.appendChild(tr); //Agregar la tag al elemento con id elementos.
var nuevaLetra = "A"; //La variable con la que se le asigna una letra a cada columna.
for (var i = 1; i <= nume; i++) {
$('<td><input type="text" class="prueba" id="'+nuevaLetra+cuentaTr+'" name="columna'+nuevaLetra+cuentaTr+'" required/></td>').appendTo('#elementos'); //Creación de nuevo input. THIS IS THE IMPORTANT!
var ASCII = nuevaLetra.charCodeAt(); //Obtener código ASCII
var aumento = ((ASCII+1 >= 65 && ASCII+1 <= 90) || (ASCII+1 >= 97 && ASCII+1 <= 122)) ? ASCII+1 : ASCII; //Incremenar la letra
var nuevaLetra = String.fromCharCode(aumento); //Tranformar el código a letra.
};
if (cuentaTr == 2){
$('<button type="button" id="eliminame">-</button>').insertAfter('#agregar'); //Creación del botón de eliminación de filas
};
});
$(document).on('click', '#eliminame', function(){ //Función que elimina las filas HERE IS MY DUDE.
$('#elementos tbody tr:last').remove(); //I WANT TO REMOVE THE LAST ROW. THIS CODE ELIMINATE ONLY THE ROWS CREATE WHEN DOM LOADED.
cuentaTr--;
if (cuentaTr == 1) {
$(this).remove();
};
});
});
</script>
What I can to do?
Thank you!
I'm sorry for my English. I can't speak English well.

Looks like there are some problems on how the tr is appended to the table, try
$(document).ready(function () {
var cuentaTr = $('#elementos >tbody >tr').length - 1; //Cuenta el número de filas que tiene la tabla originalmente, es 1.
$('#agregar').click(function () { //Clic en el botón que agrega nueva fila.
cuentaTr++; //Es el número de fila que le corresponde a cada una que se crea.
var nume = $('#elementos >tbody >tr:first >td').length; //Obtener el número de celdas
var capa = $("#elementos"); //Obtener el elemento con el id elementos
var tr = $('#tr').appendChild(tr); //Agregar la tag al elemento con id elementos.
var nuevaLetra = "A"; //La variable con la que se le asigna una letra a cada columna.
for (var i = 1; i <= nume; i++) {
$('<td><input type="text" class="prueba" id="' + nuevaLetra + cuentaTr + '" name="columna' + nuevaLetra + cuentaTr + '" required/></td>').appendTo(tr); //Creación de nuevo input. THIS IS THE IMPORTANT!
var ASCII = nuevaLetra.charCodeAt(); //Obtener código ASCII
var aumento = ((ASCII + 1 >= 65 && ASCII + 1 <= 90) || (ASCII + 1 >= 97 && ASCII + 1 <= 122)) ? ASCII + 1 : ASCII; //Incremenar la letra
var nuevaLetra = String.fromCharCode(aumento); //Tranformar el código a letra.
};
if (cuentaTr == 2) {
$('<button type="button" id="eliminame">-</button>').insertAfter('#agregar'); //Creación del botón de eliminación de filas
};
});
$(document).on('click', '#eliminame', function () { //Función que elimina las filas HERE IS MY DUDE.
$('#elementos tbody tr:last').remove(); //I WANT TO REMOVE THE LAST ROW. THIS CODE ELIMINATE ONLY THE ROWS CREATE WHEN DOM LOADED.
cuentaTr--;
if (cuentaTr == 1) {
$(this).remove();
};
});
});

var cuentaTr = $('#elementos >tbody >tr').length - 1; (already in your code) should give you the number of rows (minus one). Maybe make a jsfiddle so we can debug what's going on?