Wie verwende ich Stil in JavaScript ohne CSS?


Pavel

Wie verwende ich Stil in JavaScript ohne CSS? Ich versuche, Formen zu zeichnen, aber es gibt ein Problem mit dem Stil ... Bitte helfen Sie.

Etwas läuft falsch

    var Shape = function (width, height, radius) {

    this.width = width;
    this.height = height;
    this.radius = radius;

    this.drawShape = function () {
        var shape = document.createElement("div");
        document.body.appendChild(shape);
        shape.style.width = this.width;
        shape.style.height = this.height;
        shape.style.radius = this.radius;
        shape.style.border = '1px solid black'
    }
}

var shape1 = new Shape(10, 30, 30);
shape1.drawShape();
Nenad Vracar

Sie müssen Einheiten einstellen, auch anstelle von radiussollten Sie verwenden borderRadius.

var Shape = function(width, height, radius) {

  this.width = width;
  this.height = height;
  this.radius = radius;

  this.drawShape = function() {
    var shape = document.createElement("div");
    document.body.appendChild(shape);
    shape.style.width = this.width + 'px';
    shape.style.height = this.height + 'px';
    shape.style.borderRadius = this.radius + 'px';
    shape.style.border = '1px solid black'
  }
}

var shape1 = new Shape(10, 30, 30);
shape1.drawShape();

Verwandte Artikel


Wie verwende ich URLs in React CSS Inline-Styling ohne `$`?

Steve Reagieren lernen und versuchen, diesen Codepen zu betrügen . Ich verstehe 2 Dinge nicht. Was ist die ... vor Largebox, Flex und anderen CSS-Klassen? return <div style={{...largebox, ...flex}} key={props.id} Was macht das $ im CSS-URL-Parameter? Ist es jQ

Wie verwende ich CSS-Klassen am besten ohne Redundanz?

Arun Nandha Ich hatte ein E-Mail-Textfeld mit Standard-, Erfolgs- und Fehler-CSS-Klasse. <input id="emailInput" class="sansserif inputuser" style=" margin-top: 5px;" type="text" placeholder="Enter Email.."/> .default{ width: 306px; box-sizing: bord

Wie verwende ich Javascript, ohne Variablen zu erstellen?

Benutzer5938020 Ich habe die folgenden Codezeilen, die die Cursorposition eines HTML-Elements um 6 versetzt, so dass es am Ende des Textes 'hi wie' bis zum letzten eingegebenen Zeichen steht. HTML <div id="editable"> hi how </div> JS var range = document.c

Wie füge ich CSS-Stil in Javascript hinzu?

Sushma Eigentlich benutze ich iframe Element in HTML-Seite, aber es ist innerhalb des Tags, was Javascript bedeutet. Ich möchte diesem iframe-Element CSS hinzufügen. Wie kann ich das tun? Kann mir bitte jemand helfen Michael Stile vom übergeordneten Element we

Wie bekomme ich einen benutzerdefinierten CSS-Stil mit Javascript?

NIKHIL KURMI Ich möchte Stil bekommen, indem ich Kurse schreibe. Wenn ich einen Klassennamen "mt-9" schreibe , wird margin-top hinzugefügt: 9px; . Wenn ich "mt-13" schreibe , wird margin-top hinzugefügt: 13px; Wenn ich "mtm-12" schreibe , wird margin-top: -12p

Wie überschreibe ich den CSS-Stil mit Javascript?

Julio Otuyama Ich habe eine interaktive Seite, die die Hintergrundfarbe von td dynamisch mit Javascript ändert. Ohne Stil funktioniert diese Seite einwandfrei. Als Stilanforderung sollte die Hintergrundfarbe der Tabelle schwarz und der td-Hintergrund weiß sein