Detaillierte Erklärung dieser Referenz und benutzerdefinierter Eigenschaften in JavaScript

Funktion fn() {
	consolo.log(dies);
}
fn()

<button onclick="fn()">Klicken Sie hier, um es zu versuchen</button>

Funktion fn() {
	console.log(dies)
}

<button id="btn">Klicken Sie hier, um es zu versuchen</button>

var btn = document.getElementById('btn');
btn.onclick = Funktion() {
	konsole.log(dies);
}

var btn = document.getElementById('btn');
btn.index = 1;

 var uli = document.querySelector('ul').querySelectorAll('li');
 var oli = document.querySelector('ol').querySelectorAll('li');

für (var i = 0; i < uli.length; i++) {          
            uli[i].addEventListener('klicken', Funktion () {   
               } )
        }

  uli[i].index = i;

für (var i = 0; i < uli.length; i++) {
            uli[i].index = i;
            uli[i].addEventListener('klicken', Funktion () {
                für (var j = 0; j < uli.length; j++) {
                    uli[j].className = '';
                    oli[j].className = '';
                }
                dieser.Klassenname = "aktuell";
                oli[this.index].className = "aktuell";
            })
        }

<Stil>
        * {
            Rand: 0;
            Polsterung: 0;
            Listenstil: keiner;
        }
        .Kasten {
            Höhe: 250px;
            Breite: 300px;
            Rand: 2px durchgezogen;
        }
        ul {
            Anzeige: Flex;
            Inhalt ausrichten: Abstand dazwischen;
            Hintergrund: rot;
            Rahmen unten: 2px #ccc;
        }
        ul li {
            schweben: links;
            Breite: 100px;
            Farbe: #fff;
            Cursor: Zeiger;
            Höhe: 40px;
            Zeilenhöhe: 40px;
            Textausrichtung: zentriert;
        }
        ul li.aktuell {
            Rahmen unten: 5px grün durchgehend;
        }
        ol li {
            Rand: 30px;
            Anzeige: keine;
        }
        ol li.aktuell {
            Anzeige: Block;
        }
    </Stil>
    <div Klasse="Box">
        <ul>
            <li class="current">Erste Seite</li>
            <li>Seite 2</li>
            <li>Seite 3</li>
        </ul>
        <ol>
            <li class="current">Ich bin die erste Seite</li>
            <li>Ich bin die zweite Seite</li>
            <li>Ich bin die dritte Seite</li>
        </ol>
    </div>