JvaaScriptAPI

api for manipulating documents, Find out more about these types of API in Manipulating documents.


apis that fetch data from the server , Find out more about such APIs in Fetching data from the server.

APIs for drawing and manipulating graphics, the most popular ones are Canvas and WebGL, which allow you to programmatically update the pixel data contained in an HTML <canvas> element to create 2D and 3D scenes

Audio and Video APIs like HTMLMediaElement, the Web Audio API, and WebRTC

Device APIs s (see the Notifications API) or vibration hardware (see the Vibration API). 手机支持震动，
window.navigator.vibrate([200, 100, 200]);



Client-side storage APIs are becoming a lot more widespread in web browsers,e.g. simple name/value storage with the Web Storage API, and more complex tabular data storage with the IndexedDB API.

<audio src="outfoxing.mp3"></audio>
 | 

 | <button class="paused">Play</button>
 | <br>
 | <input type="range" min="0" max="1" step="0.01" value="1" class="volume">
 | 

 | <script>
 | // Create an AudioContext (cross browser)
 | const AudioContext = window.AudioContext || window.webkitAudioContext;
 | const audioCtx = new AudioContext();
 | 

 | // store references to our HTML elements
 | const audioElement = document.querySelector('audio');
 | const playBtn = document.querySelector('button');
 | const volumeSlider = document.querySelector('.volume');
 | 

 | // load the audio source into our audio graph
 | const audioSource = audioCtx.createMediaElementSource(audioElement);
 | 

 | // play/pause audio
 | playBtn.addEventListener('click', function() {
 |  // check if context is in suspended state (autoplay policy)
 |  if (audioCtx.state === 'suspended') {
 |  audioCtx.resume();
 |  }
 | 

 |  // if track is stopped, play it
 |  if (this.getAttribute('class') === 'paused') {
 |  audioElement.play();
 |  this.setAttribute('class', 'playing');
 |  this.textContent = 'Pause'
 |  // if track is playing, stop it
 | } else if (this.getAttribute('class') === 'playing') {
 |  audioElement.pause();
 |  this.setAttribute('class', 'paused');
 |  this.textContent = 'Play';
 |  }
 | });
 | 

 | // if track ends
 | audioElement.addEventListener('ended', function() {
 |  playBtn.setAttribute('class', 'paused');
 |  playBtn.textContent = 'Play'
 | });
 | 

 | // volume
 | const gainNode = audioCtx.createGain();
 | 

 | volumeSlider.addEventListener('input', function() {
 |  gainNode.gain.value = this.value;
 | });
 | 

 | // connect our graph
 | audioSource.connect(gainNode).connect(audioCtx.destination);
 | 

 | // Track credit: Outfoxing the Fox by Kevin MacLeod under Creative Commons
 | 

 | </script>
 |
阅读量: 678
发布于:
修改于: