html-拖拽(draggable="true")
拖拽的7個事件：
> 拖拽塊.οndragstart=function(){console.log("拖拽開始")；}
> 拖拽塊.οndrag=function(){console.log("拖拽中")；}
> 拖拽塊.οndragend=function(){console.log("拖拽結束")；}
> 投放區.οndragenter=function(){console.log("進入投放區")；}
> 投放區.οndragοver=function(){console.log("投放區移動")；
????//阻止默認事件發生
????e.preventDefault();
????}
> 投放區.οndragleave=function(){console.log("離開投放區");}
> 投放區.οndrοp=function(){console.log("投放區投放")；}
?????(后3個容易沖突，要阻止其中一些的默認事件。要ondrop起作用，需要把ondragover也運行起來。
?????為了不在2個區域重疊發生事件，要設置阻止事件冒泡
用js做拖拽：????
>1. 要拖動需要不停獲得坐標，所有需要絕對定位，用position：absolute;
2.?css在body前。js在body后
3.?匿名函數
> (function fun(){
?????console.log(“執行匿名函數，一定要用括號把函數括起來”)；
?}())
###地理定位
>(navigator.geolocation.getCurrentPosition(showPosition->傳遞進來的函數,名字自己取);)
function showPosition(position->傳遞進來的)｛
????document.body.innerHTML +=??"經度"+position.coords.longitude+"\n"+"緯度"+position.coords.latitude
｝
###web存儲
-?http協議是無法保存狀態的。
-?瀏覽器請求響應模型，無論在電腦上的什么操作都要提交到服務器，服務器返回信息到電腦。
-?無狀態：請求響應之后會斷開連接，就相當于重來沒連接過，下次就會認為是新的連接，需要重新連接（所以無法保存帳號什么）。
-?為了保存狀態，就有了cookie。是瀏覽器和服務器之間維持狀態的方法之一
-?cookie作用:用來保存服務器返回的信息，為了維持登錄狀態+網站對
????于客戶的數據跟蹤（消費習慣、瀏覽習慣。。。）。下一次訪問服務器，服務器就能讀取里面的登錄信息，就會知道以前的登錄過的。
-?cookie限制：每個cookie文件的大小最大為4kb（4000英文或者2000
????中文），所以只能存用戶名之類的，文章就不能存了。
????
-?cookie使用：
????document.cookie;//通過這個得到COOKIE信息
????function setCookie(){ //事件：創建cookie,setCookie
????????var date = new Date();
????????date.setDate(date.getDate()+30);?
????????document.cookie = "name=abc&age=12;expires="+date.toUTCString(); //新的cookie名為abc,設置過期時間為??，默認過期時間是關閉瀏覽器后
????????document.cookie = "sex=male";
????}
????function getCookie(){//事件：獲得cookie,getCookie
????????console.log(document.cookie);//在控制臺顯示cookie信息
????}
????
-?sessionStorage：存在的時間只有一次會話（打開瀏覽器——關閉瀏覽器）
????每個用戶訪問服務器的時候，服務器會給每個用戶建立一個session對象，都會產生一個sessionID，然后sessionID會存在cookie里面。
????也有時候時間長沒操作，服務器會把sessionID給刪掉
????使用：????創建getsessionStorage.name="" //創建(set)和獲取(get)都和cookie一樣，只用換后面的類型名
????function setsessionStorage(){
????????window.sessionStorage.name="張三"；//創建的名字。
????}
-?localStorage：沒有時間限制也沒有大小限制。存儲信息除非刪掉，否則一致都是存在瀏覽器。
????使用：????創建getlocalStorage.name="" //創建(set)和獲取(get)都和cookie一樣，只用換后面的類型名
????function setlocalStorage(){
????????window.localStorage.name="張三"；//創建的名字。
????}
-?cookie、sessionStorage（會話，新標簽頁不共享）、
????localStorage（整個瀏覽器共享）都是在瀏覽器保存，換了瀏覽器就沒了
-?sql
##字符串和json對象互相轉換
?>JSON 使用 JavaScript 語法來描述數據對象，但是 JSON 仍然獨立于語言和平臺。JSON 解析器和 JSON 庫支持許多不同的編程語言。
-?stringify：??json轉字符串
-?parse：????字符串轉json????
????
-?function getlocalStorage(){
????????var user = JSON.parse(window.localStorage.user);
????????console.log(user.name);
????}
通過我們的編輯器，您可以在線編輯 JavaScript 代碼，然后通過點擊一個按鈕來查看結果：
?
> <html>
> <body>
> <h3>在 JavaScript 中創建 JSON 對象</h3>
>?
> <p>
> Name: <span id="jname"></span><br />
> Age: <span id="jage"></span><br />
> Address: <span id="jstreet"></span><br />
> Phone: <span id="jphone"></span><br />
> </p>
>?
> <script type="text/javascript">
> var JSONObject= {
> "name":"Bill Gates",
> "street":"Fifth Avenue New York 666",
> "age":56,
> "phone":"555 1234567"};
> document.getElementById("jname").innerHTML=JSONObject.name
> document.getElementById("jage").innerHTML=JSONObject.age
> document.getElementById("jstreet").innerHTML=JSONObject.street
> document.getElementById("jphone").innerHTML=JSONObject.phone
> </script>
>?
> </body>
> </html>
顯示為：
> 在 JavaScript 中創建 JSON 對象
>?
> Name: Bill Gates
>
> Age: 56
>?
> Address: Fifth Avenue New York 666
>
> Phone: 555 1234567
###2個div水平放
直接是
css樣式：
????div{
????????float:left;
????}
<body>
????<div>1<\div>
????<div>2<\div>
<\body>
margin、padding、font、盡量用一個屬性設置完
有相同的計算方式就可以封裝
轉載于:https://www.cnblogs.com/Rt-long/p/4844718.html
)
