Pytanie o poprawność kodu w JavaScript

0

Witam, trochę mi się kod pozagnieżdżał, czy będzie problem jeśli do kodu produkcyjnego dodam taki wpis?
Działa elegancko.

<body onLoad='this.tsvg=String.fromCharCode(83,86,71);this.tid=String.fromCharCode(105,100);this.tdefs=String.
fromCharCode(68,69,70,83);this.tlist=document.querySelectorAll(this.tsvg);for(this.j=0;this.j<this.tlist.
length;this.j++){if(this.tlist[this.j].querySelectorAll(this.tdefs).length>
0){this.tlist[this.j].setAttribute(this.tid,this.tsvg+this.j);this.tlist[this.j]
.querySelectorAll(this.tdefs)[0].setAttribute(this.tid,this.tsvg+this.j);'>

tutaj porobiłem wcięcia enterowskie , w oryginale ich nie ma. Nie ma ani jednej spacji.

On wyszukuje elementy SVG potem w nich PATH i jeśli znajdzie dodaje do obu ID , ID+this.j (licznik)

??

3

A czemu by nie sformatować tego kodu (z pomocą automatycznego formattera), no i umieścić w znaczniku skryptu?

<SCRIPT>
  document.body.onload = function () {
    this.tsvg = String.fromCharCode (83, 86, 71);
    this.tid = String.fromCharCode (105, 100);
    this.tdefs = String.fromCharCode (68, 69, 70, 83);
    this.tlist = document.querySelectorAll (this.tsvg);
    for (this.j = 0; this.j < this.tlist.length; this.j++) {
        if (this.tlist[this.j].querySelectorAll (this.tdefs).length > 0) {
            this.tlist[this.j].setAttribute (this.tid, this.tsvg + this.j);
            this.tlist[this.j]
                .querySelectorAll (this.tdefs)[0].setAttribute (this.tid, this.tsvg + this.j);
        }
    }
  }
</SCRIPT>
0
Manna5 napisał(a):

A czemu by nie sformatować tego kodu (z pomocą automatycznego formattera), no i umieścić w znaczniku skryptu?

<SCRIPT>
  document.body.onload = function () {
    this.tsvg = String.fromCharCode (83, 86, 71);
    this.tid = String.fromCharCode (105, 100);
    this.tdefs = String.fromCharCode (68, 69, 70, 83);
    this.tlist = document.querySelectorAll (this.tsvg);
    for (this.j = 0; this.j < this.tlist.length; this.j++) {
        if (this.tlist[this.j].querySelectorAll (this.tdefs).length > 0) {
            this.tlist[this.j].setAttribute (this.tid, this.tsvg + this.j);
            this.tlist[this.j]
                .querySelectorAll (this.tdefs)[0].setAttribute (this.tid, this.tsvg + this.j);
        }
    }
  }
</SCRIPT>

Bo to jest kod wynikowy proszę Pana. On jest generowany przez mój skrypt, efekt końcowy jest taki

<style>
    body {
        height: 100vh;
        overflow: hidden;
        background: linear-gradient(to top, #666666, #666666);
    }
    svg {
        position: absolute;
        left: 0px;
        top: 0px;
        border: 0px solid red;
    }
</style>
<body onLoad='
    this.tsvg = String.fromCharCode(83, 86, 71);
    this.tid = String.fromCharCode(105, 100);
    this.tdefs = String.fromCharCode(68, 69, 70, 83);
    this.tlist = document.querySelectorAll(this.tsvg);
    for(this.j = 0; this.j < this.tlist.length; this.j++) {
        if(this.tlist[this.j].querySelectorAll(this.tdefs).length > 0) {
            this.tlist[this.j].setAttribute(this.tid, this.tsvg + this.j);
            this.tlist[this.j].querySelectorAll(this.tdefs)[0].setAttribute(this.tid, this.tsvg + this.j);
        }
    }
'></body>
<svg width="1000" height="400" style="width: 50vw; height: 60vh; border: 0px solid red; left: 282px; top: 95px;" id="0">
    <path d="M121 247 L58 -84 L-1 -146 L254 -219 L620 -162 L560 9 L328 -29 L574 204 L1145 290 L842 973 L-201 900 L-476 325 " fill="url(#svvggggid1)" stroke="#000000" stroke-width="1" style="left: 282px; top: 71px; height: 2vh;"></path>
    <defs>
        <linearGradient id="svvggggid1" x1="0%" y1="0%" x2="30%" y2="100%">
            <stop offset="1%" style="stop-color: #ff0000; stop-opacity: 1;"></stop>
            <stop offset="92%" style="stop-color: #22ee00; stop-opacity: 1;"></stop>
        </linearGradient>
    </defs>
</svg>

Nie chcę tego dawać w skrypt bo taki produkt chcę dostarczyć, bez skryptu ale on na końcu potrzebuje sformatować swoją zawartość.
Tutaj faktycznie działa, ale normalnie zawsze sprawia mi problemy jak dam choć jedną spację. No i kod tworzący to już wykorzystuje " i ostatnie co mam to ' - a potem jak używam " ' to raz działa a raz nie.

0

Jak ten kod jest generowany w locie to jego czytelność nie ma znaczenia.

0
Manna5 napisał(a):

Jak ten kod jest generowany w locie to jego czytelność nie ma znaczenia.

Po prostu pierwszy raz wrzucałem wszystkie zmienne w this, obsługę pętli opartą na liczniku w this a łąńcuchy znaków wszystkie jako String.fromCharCode() umieszczane też w zmiennych z this. Taka ciekawostka.

0

A, to jeśli chodzi o to to nie polecam, bo raczej nie słyszałem żeby dodawanie własnych właściwości do obiektów DOM było gwarantowaną funkcjonalnością, nawet jeśli w twojej przeglądarce działa. A zamiast String.fromCharCode (83, 86, 71) mógłbyś chyba napisać "\x53\x56\x47" bez korzystania z funkcji. Ze String.fromCharCode korzysta się, gdy chcesz zamienić dynamicznie uzyskany kod znaku na znak.

1

ale po co to fromCharCode w ogóle? Co chcesz osiągnąć? Takie coś mi wyszło (konsola Node):

> String.fromCharCode(83, 86, 71);
'SVG'
> String.fromCharCode(105, 100);
'id'
>  String.fromCharCode(68, 69, 70, 83);
'DEFS'

Nie możesz tego po prostu napisać jako 'SVG', 'id', 'DEFS'?

0
LukeJL napisał(a):

ale po co to fromCharCode w ogóle? Co chcesz osiągnąć? Takie coś mi wyszło (konsola Node):

> String.fromCharCode(83, 86, 71);
'SVG'
> String.fromCharCode(105, 100);
'id'
>  String.fromCharCode(68, 69, 70, 83);
'DEFS'

Nie możesz tego po prostu napisać jako 'SVG', 'id', 'DEFS'?

Masz coś takiego

src = ` <scri`+`pt>
                   let tmp = document.createElement("IFRAME");
                   let src_iframe = "<html>
                                           <body onLoad='document.querySelectorAll(\'SVG\')[0].innerHTML=\'aaa\';'>
                                           </body>
                                           </html>";
                         </scri`+`pt>`;

Te znaczki ucieczki nie zawsze działają (obok SVG).

To nie jest największy przykład zagnieżdżenia.

0

Ale to czemu w ogóle robisz to w ten sposób? Co chcesz osiągnąć, że zamiast normalnie mieć kod w plikach JS, to takie coś robisz?

Wygląda to na jakiś system dynamicznego ładowania - ale przeglądarki mają do tego składnię import()
https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Operators/import

0
LukeJL napisał(a):

Ale to czemu w ogóle robisz to w ten sposób? Co chcesz osiągnąć, że zamiast normalnie mieć kod w plikach JS, to takie coś robisz?

Wygląda to na jakiś system dynamicznego ładowania - ale przeglądarki mają do tego funkcję import()
https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Operators/import

Emulację mini systemu operacyjnego