Creating a slug from a string in JavaScriptArticle contains
  1. Creating a slug from a string in JavaScript
  2. Code explanation
  3. Example usage
Get XPath from the element using JavaScriptArticle contains
  1. Custom function to get XPath
  2. Breakdown of how it works
  3. Additional tools
Use JavaScript to determine whether a string is a valid JSON stringArticle contains
  1. Check if provided string is a valid JSON string code
  2. Code explanation
The text "JavaScript. Is my string a valid JSON string?" on a desert.

Use JavaScript to determine whether a string is a valid JSON string

To determine whether a string is a valid JSON string in JavaScript, you can use the JSON.parse() method within a try...catch block. This approach leverages the fact that JSON.parse() throws a SyntaxError exception if the input string is not valid JSON. By catching this exception, you can accurately determine if the string represents valid JSON.

Continue reading “Use JavaScript to determine whether a string is a valid JSON string”
How to validate an email address in JavaScriptArticle contains
  1. checkValidity method from an input type="email"
  2. Validate an email address in JavaScript
  3. Avoiding a complex regular expression
  4. Final note
A hand pointing to dozens of envelopes symbolizing electronic email and the text "JavaScript validating email format"

How to validate an email address in JavaScript

To check if an email is valid using JavaScript, you can use the checkValidity() method from an <input type="email"/> field (when checking in the browser environment) and additionally check for at (@) symbol in the email address.

We are going to validate the email address format only using browser and custom validation, but not if the email actually exists.

The below code consists of two functions: isInputTypeSupported and isValidEmail. These functions are designed to validate input types and email addresses, leveraging the HTML5 form validation capabilities and custom logic for more comprehensive validation.

Continue reading “How to validate an email address in JavaScript”
Truncating text and making it accessibleArticle contains
  1. CSS for truncation
    1. CSS for single-line text truncation
    2. CSS for multi-line text truncation
  2. JavaScript for truncation
    1. Truncating text by words
    2. Truncating by characters
    3. Truncating in the middle
  3. Accessibility considerations
  4. Alternatives to truncation
  5. Avoid information loss
Alternative text for CSS generated contentArticle contains
  1. Creating alternative description for CSS content property
  2. Implementation and usage
  3. Workable example
Resolving the script tag type attribute hash prepending issue with CloudflareArticle contains
  1. Solution for hash prepending issue with Cloudflare
  2. Final notes
"JavaScript" sentence and script HTML element

Resolving the script tag type attribute hash prepending issue with Cloudflare

If your script HTML tag has the type attribute prepended with a hash, like <script type="ea10e272b0a1989fb2f3aa4e-text/javascript">...</script> and you’re using Cloudflare services, then the root cause is the Cloudflare Rocket Loader, a feature of Cloudflare that optimizes the loading of JavaScript resources on your web pages.

Rocket Loader modifies the type attribute of script tags for website loading optimization by deferring the loading of JavaScript until after rendering. This modification can sometimes cause issues with HTML validation and Content Security Policy (CSP) headers.

Cloudflare Rocket Loader adds an argument “type” into the script tag and causing issues with the W3C validator due to the “subtype missing” error.

Continue reading “Resolving the script tag type attribute hash prepending issue with Cloudflare”
Get days between two dates in JavaScriptArticle contains
  1. JavaScript code for calculating days between two dates
  2. Code explanation
  3. Practical example with unit tests for calculating days between dates
Get and capitalize the first letter of a string in JavaScriptArticle contains
  1. How strings are represented in JavaScript?
  2. Getting and capitalizing the first character of a string in JavaScript
  3. Practical example: Capitalizing the first letter of a string
Best practices for optimizing SVG codeArticle contains
  1. Minify the code
  2. Compress the SVG files
    1. Enabling serving SVGZ files in Apache
    2. Enabling serving SVGZ files in Nginx
    3. Enabling serving SVGZ files in IIS
    4. Example page with SVG and SVGz
  3. Using Inkscape to create optimized SVGs directly
  4. Command-line tool