p5.js Elemento hasClass() Método

El método hasClass() de p5.Element en p5.js se usa para verificar si la clase especificada ya está presente en el elemento. Devuelve un valor booleano que indica si la clase estaba presente o no. Un elemento puede tener varias clases asignadas.

Sintaxis:

hasClass( class )

Parámetros: Esta función acepta un solo parámetro como se mencionó anteriormente y se describe a continuación.

  • clase: Es una string que denota la clase que se va a comprobar.

Ejemplo: El siguiente ejemplo ilustra el método hasClass() en p5.js

<html>
  
<head>
    <script src=
"https://cdn.jsdelivr.net/npm/p5@0.10.2/lib/p5.js">
    </script>
    <script src="sketch.js"></script>
</head>
  
<body></body>
  
</html>

Código Javascript: el siguiente código se utiliza para el archivo «sketch.js» anterior.

Javascript

function setup() {
  createCanvas(600, 300);
  textSize(18);
    
  // Create a new p5.Element
  tmpElement = createElement("div");
  
  text("Click on the buttons to add, remove " +
       "or check the class of the element", 20, 20);
  
  setBtn = 
    createButton("Add color class to element");
    setBtn.position(30, 40);
    setBtn.mouseClicked(() => {
    tmpElement.addClass("color");
  });
  
  removeBtn =
    createButton("Remove color class from element");
  removeBtn.position(30, 80);
  removeBtn.mouseClicked(() => {
    tmpElement.removeClass("color");
  });
  
  showBtn = createButton("Check if class exists");
  showBtn.position(30, 120);
  showBtn.mouseClicked(checkClass);
}
  
function checkClass() {
  clear();
  // Check if the given class exists
  let hasC = tmpElement.hasClass("color");
  
  text("hasClass('color') gives the output: " +
       hasC, 20, 180);
  
  text("Click on the buttons to add, remove or " +
       "check the class of the element", 20, 20);
}

Producción:

Editor en línea: https://editor.p5js.org/
Configuración del entorno: https://www.geeksforgeeks.org/p5-js-soundfile-object-installation-and-methods/
Referencia: https://p5js.org/ referencia/#/p5.Element/hasClass

Publicación traducida automáticamente

Artículo escrito por sayantanm19 y traducido por Barcelona Geeks. The original can be accessed here. Licence: CCBY-SA

Deja una respuesta

Tu dirección de correo electrónico no será publicada. Los campos obligatorios están marcados con *