H 5新規API-表示、記憶

2681 ワード

まず、フルスクリーンを呼び出し、フルスクリーンを終了するコードを見てみましょう.



    


    <button type="button" name="button"> </button>
    <button type="button" name="button"> </button>

<script type="text/javascript">
document.querySelectorAll("button")[0].onclick = function(){
    console.log(document.body.requestFullscreen)
    document.body.webkitRequestFullScreen();
}
document.querySelectorAll("button")[1].onclick = function(){
    document.webkitCancelFullScreen();
}
    
</script>

</code></pre> 
 <p>h5 visibilitychange 。</p> 
 <pre><code>


    <title/>


    <button type="button" name="button"> </button>
    <button type="button" name="button"> </button>

<script type="text/javascript">
console.log(document.visibilityState);
document.addEventListener("visibilitychange",function(){
    console.log(document.visibilityState);
    console.log(document.hidden);
})
</script>

</code></pre> 
 <h2> </h2> 
 <p> <em>  localStorage</em> <em> sessionStorage</em>, cookie 。 5M。<br/>  : ,API 。<br/> cookie 4kb,api , document.cookie, , , 。<br/> <em>localStorage</em> , , 。<br/> sessionStorage ,localStorage 。</p> 
 <pre><code>


    <title/>



<script type="text/javascript">
var obj ={age:12,address:" "};
console.log(localStorage);
localStorage.setItem("user","admin");
localStorage.setItem("desc",JSON.stringify(obj));
console.log(localStorage.getItem("user"));
console.log(JSON.parse(localStorage.getItem("desc")));
localStorage.setItem("user","admin");

localStorage.removeItem("user");
</script>

</code></pre> 
 <h2> </h2> 
 <p>geolocation API, 。<br/>  , https 。<br/>  localhost  ( :IP )<br/>  。<br/>  。</p> 
 <pre><code>


    <title/>



<script type="text/javascript">
console.log(navigator)
if (navigator.geolocation) {
    navigator.geolocation.getCurrentPosition(function(coords){
        console.log(coords)
    },function(err){

    });
}
</script>

</code></pre> 
 <p>navigator.geolocation.getCurrentPosition(successCallback,errorCallback[,options])<br/> successCallback  <br/> errorCallback  </p> 
</article>
                            </div>
                        </div>