📜  p5.js | removeAttribute()函数

📅  最后修改于: 2022-05-13 01:56:26.481000             🧑  作者: Mango

p5.js | removeAttribute()函数

removeAttribute()函数是一个内置函数,用于删除指定元素的属性。
此函数需要 p5.dom 库。因此,在index.html文件的 head 部分添加以下行。

javascript


javascript
var input_val;
var checkbox;
function setup() {
     
    // Canvas size 400*400
    createCanvas(400, 200);
     
    // Set background color
    background('green');
     
    // Create an input element with its value
    input_val = createInput('Welcome to GeeksforGeeks', true); 
   
    // Set the position of div element
    input_val.position(30, 80);
   
    // Set width of input field
    input_val.style('width', '250px');
   
    // Set font-size of input text
    input_val.style('font-size', '20px');
   
    // Set margin property
    input_val.style('margin-left', '50px');
     
    // Create a checkbox
    checkbox = createCheckbox('enable', true);
     
    // Set the status of checkbox
    checkbox.changed(enableInputText);
}
 
function enableInputText() {
   
   if (this.checked()) {
      
       // Re-enable the button
       input_val.removeAttribute('disabled');
   }
  else {
      
      // Disable the button
      input_val.attribute('disabled', '');
   }
 }


句法:

removeAttribute( attr )

参数:此函数接受单个参数attr ,其中包含需要删除的属性的值。
下面的示例说明了 p5.js 中的 removeAttribute()函数:
例子:

javascript

var input_val;
var checkbox;
function setup() {
     
    // Canvas size 400*400
    createCanvas(400, 200);
     
    // Set background color
    background('green');
     
    // Create an input element with its value
    input_val = createInput('Welcome to GeeksforGeeks', true); 
   
    // Set the position of div element
    input_val.position(30, 80);
   
    // Set width of input field
    input_val.style('width', '250px');
   
    // Set font-size of input text
    input_val.style('font-size', '20px');
   
    // Set margin property
    input_val.style('margin-left', '50px');
     
    // Create a checkbox
    checkbox = createCheckbox('enable', true);
     
    // Set the status of checkbox
    checkbox.changed(enableInputText);
}
 
function enableInputText() {
   
   if (this.checked()) {
      
       // Re-enable the button
       input_val.removeAttribute('disabled');
   }
  else {
      
      // Disable the button
      input_val.attribute('disabled', '');
   }
 }

输出:

  • 单击以启用复选框:

  • 单击以禁用复选框: