Categories
JavaScript Answers

How to remove all classes from element with JavaScript?

Sometimes, we want to remove all classes from element with JavaScript.

In this article, we’ll look at how to remove all classes from element with JavaScript.

How to remove all classes from element with JavaScript?

To remove all classes from element with JavaScript, we can call removeAttribute on the element.

For instance, we write:

<button class='my-class second'>
  hello
</button>

to add a button with some classes.

Then we write:

.my-class {
  background-color: red;
}

.second {
  box-shadow: 0px 0px 10px 10px;
}

to add some classes with styles.

Then we remove all the classes when the button is clicked by writing:

document.querySelector('button').onclick = (e) => {
  e.target.removeAttribute("class");
}

We select the button with querySelector.

Then we set its onclick property to a function that calls removeAttribute on the button being clicked to remove the class attribute.

Conclusion

To remove all classes from element with JavaScript, we can call removeAttribute on the element.

Categories
JavaScript Answers

How to use time zone offset in Node.js?

Sometimes, we want to use time zone offset in Node.js.

In this article, we’ll look at how to use time zone offset in Node.js.

How to use time zone offset in Node.js?

To use time zone offset in Node.js, we can use the node-time library.

To install it, we run npm i moment-timezone.

Then we use it by writing:

const Moment = require('moment-timezone');
const t = Moment().tz('America/Los_Angeles').format();
console.log(t)

We call Moment to return a moment object.

Then we call tz with the time zone string to set the time zone of the moment object.

And then we call format to return a date time string.

As a result we get '2022-01-17T18:17:02-08:00'.

Conclusion

To use time zone offset in Node.js, we can use the node-time library.

To install it, we run npm i moment-timezone.

Categories
JavaScript Answers

How to set a JavaScript array as options for a select element?

Sometimes, we want to set a JavaScript array as options for a select element.

In this article, we’ll look at how to set a JavaScript array as options for a select element.

How to set a JavaScript array as options for a select element?

To set a JavaScript array as options for a select element, we can use the options.add method and the Option constructor.

For instance, we write:

<select>
</select>

to add the select drop down.

Then we write:

const options = [{
    "text": "Option 1",
    "value": "Value 1"
  },
  {
    "text": "Option 2",
    "value": "Value 2",
    "selected": true
  },
  {
    "text": "Option 3",
    "value": "Value 3"
  }
];

const selectBox = document.querySelector('select');

for (const o of options) {
  const {
    text,
    value,
    selected
  } = o
  selectBox.options.add(new Option(text, value, selected, selected));
}

to select the select element with querySelector.

Then we loop through the options array and call selectBox.options.add to add the options entry o into the select drop down by instantiating an Option instance.

The last argument is the default selected attribute value.

And the first 2 arguments are text and value for the option element.

Now we should see Option 2 is selected.

Conclusion

To set a JavaScript array as options for a select element, we can use the options.add method and the Option constructor.

Categories
JavaScript Answers

How to read and write file lines with Node.js and JavaScript?

Sometimes, we want to read and write file lines with Node.js and JavaScript.

In this article, we’ll look at how to read and write file lines with Node.js and JavaScript.

How to read and write file lines with Node.js and JavaScript?

To read and write file lines with Node.js and JavaScript, we can call the readFileSync method to read the file into a string.

Then we call JavaScript string’s split method to split the string into an array.

And we loop through the array to write each line to the file with appendFileSync.

For instance, we write:

const fs = require("fs");

for (const line of fs.readFileSync('./input.txt').toString().split('\n')) {
  console.log(line);
  fs.appendFileSync("./output.txt", line.toString() + "\n");
};

We call readFileSync with the path to the file.

Then we call toString to convert the file into a string.

Next, we call split to split the string into an array.

Then we use the for-of loop to loop through each line.

And finally, we call appendFileSync to write the line into the output.txt file.

Conclusion

To read and write file lines with Node.js and JavaScript, we can call the readFileSync method to read the file into a string.

Then we call JavaScript string’s split method to split the string into an array.

And we loop through the array to write each line to the file with appendFileSync.

Categories
JavaScript Answers

How to convert binary data to base64 with JavaScript?

Sometimes, we want to convert binary data to base64 with JavaScript.

In this article, we’ll look at how to convert binary data to base64 with JavaScript.

How to convert binary data to base64 with JavaScript?

To convert binary data to base64 with JavaScript, we can use a FileReader instance.

For instance, we write:

<input type="file" />

to add a file input.

Then we write:

const input = document.querySelector('input')
const reader = new FileReader()
reader.onload = (e) => {
  console.log(e.target.result);
}

input.onchange = (e) => {
  const [file] = e.target.files
  reader.readAsDataURL(new Blob([file]));
}

to select the input with document.querySelector.

Then we create the FileReader instance and set its onload property to a function that has the file reader result.

Then we set the input.onchange property to a function that gets the file from the input.

And then we call reader.readAsDataURL with a Blob instance containing the file.

Conclusion

To convert binary data to base64 with JavaScript, we can use a FileReader instance.