Load external SVG

In this example, we will load an external SVG and manipulate it with JavaScript. For that to happen, three steps are required :

  1. Add meaningful IDs to the SVG elements (or group of elements) that will be manipulated with JavaScript.
  2. Include the svg using the object tag.
  3. Add an event listener for the svg to be loaded before executing JavaScript instructions on it.

Try to click on the different elements of the face to see their names.

You have not clicked yet!