Source

<!DOCTYPE html>
<html>
  <!--
    requires the following npm packages:

    * leaflet
    * leaflet-providers
  -->
  <head>
    <title>Add an alternative tile layer</title>
    <meta charset="utf-8" />
    <script src="../../node_modules/leaflet/dist/leaflet.js"></script>
    <link rel="stylesheet" href="../../node_modules/leaflet/dist/leaflet.css"/>
    <script src="../../node_modules/leaflet-providers/leaflet-providers.js"></script>
    <style>
      body {
        margin: 0;
        padding: 0;
      }
      #mapDiv {
        position: absolute;
        top: 0;
        bottom: 0;
        width: 100%;
      }
    </style>
  </head>
  <body>
    <div id='mapDiv'></div>
    <script>
      var latLon = [53.56250, 9.95982];
      var zoom = 18;

      var osmLayer = L.tileLayer.provider('OpenStreetMap.Mapnik');
      var germanLayer = L.tileLayer.provider('OpenStreetMap.DE');

      var myMap = L.map('mapDiv', {layers: osmLayer}).setView(latLon, zoom);

      var baseLayers = {
                         'OSM': osmLayer, 
                         'German': germanLayer
                       };
      L.control.layers(baseLayers, {}, {collapsed: false}).addTo(myMap);
    </script>
  </body>
</html>