How can I reduce this line of code in javascript?

Asked

Viewed 197 times

2

I have a file like this:

<html>
<script>
  var a = document.createElement('script');
  a.src = 'js/index.js';
  document.getElementsByTagName('html')[0].appendChild(a);
</script>
</html>

I have a folder called js, in this folder I have 8 files with the extension .js. These files have very similar lines of code and similar... So I did it alphabetically and also to facilitate your code visualization and analysis.

I started from the letter "a" to the letter "g". With the exception of the last file, whose name I put: "index.js". As you can see below:

a. js

var j = document.createAttribute("id"); 
j.value = "ty";
var k = document.getElementsByTagName("ty")[0]; 
k.setAttributeNode(j); 

b. js

var h = document.createAttribute("id"); 
h.value = "rty";
var i = document.getElementsByTagName("rty")[0];
i.setAttributeNode(h);

c js.

var g = document.createAttribute("id"); 
g.value = "avs";
var h = document.getElementsByTagName("avs")[0];
h.setAttributeNode(g); 

d. js

var a = document.createElement('avs');
document.write('<avs></avs>');
document.getElementsByTagName('html')[0].appendChild(a);

e. js

var c = document.createElement('ty');
document.write('<ty></ty>'); 
document.getElementsByTagName('html')[0].append(c);

f. js

var b = document.createElement('rty'); 
document.write('<rty></rty>'); 
document.getElementsByTagName('html')[0].appendChild(b);

g js.

var k = document.body;
k.parentNode.removeChild(k);
var l = document.head; 
l.parentNode.removeChild(l);    

And finally index.js:

var a = document.createElement('script'); 
a.src = 'js/d.js';
document.getElementsByTagName('script')[0].appendChild(a);
var b = document.createElement('script'); 
b.src = 'js/e.js';
document.getElementsByTagName('script')[0].appendChild(b);
var c = document.createElement('script'); 
c.src = 'js/f.js';
document.getElementsByTagName('script')[0].appendChild(c);
var d = document.createElement('script'); 
d.src = 'js/c.js';
document.getElementsByTagName('script')[0].appendChild(d);
var e = document.createElement('script'); 
e.src = 'js/b.js';
document.getElementsByTagName('script')[0].appendChild(e);
var f = document.createElement('script'); 
f.src = 'js/a.js';
document.getElementsByTagName('script')[0].appendChild(f);
var g = document.createElement('script'); 
g.src = 'js/g.js';
document.getElementsByTagName('script')[0].appendChild(g);
var h = document.createElement("link"); 
h.setAttribute("rel", "stylesheet");
h.setAttribute("src", "css/style.css"); 
document.getElementsByTagName('html')[0].appendChild(h);

So... how can I reduce these lines of code to something simpler?

  • First, what do you intend to achieve with these codes? Second, use letters to 'simplify' the name of the script can be a bore, better use a name easier to identify for what that js

  • I created using the plnkr the scope of your project, but I still don’t understand what should happen

1 answer

0

I don’t know exactly the reason for this code, just looking at it can’t understand what you intend to do by creating elements in the DOM that don’t exist in the HTML itself.

I think before I answer your question, I’d like you to explain what problem you’re trying to solve and then give you an answer or an idea.

Some things I can tell you are:

  • Do not create files or generic names (a,b,c,etc.), it is almost impossible to decipher what the code means. Example:

    //Criando uma variável idade
    //má prática
    var i = 20;
    
    //boa prática
    var idade = 20;
    
  • Document.write reloads the DOM, and this can be a very bad thing

  • When you have a solution that will repeat itself several times, the good practice is to create a function that receives the variables and call it several times.

Anyway, detail what you want to do to be able to help you with this!

Browser other questions tagged

You are not signed in. Login or sign up in order to post.