javascript callback

JSON

{ "name":"John", "age":30, "city":"New York"}

JSON.parse(json_str)

獲取時間

function getTime(){
    //第一種  1498627266000
    var millisecond =Date.parse(new Date());
    console.log(millisecond);
    //第二種   1498627266558
    var millisecond =(new Date()).valueOf();
    console.log(millisecond);
    //第三種   1498627266558
    var millisecond =new Date().getTime();
    console.log(millisecond);
    
    var myDate = new Date();
    console.log(myDate.getFullYear()); //獲取完整的年份(4位,1970-????)
    console.log(myDate.getMonth()); //獲取當前月份(0-11,0表明1月)
    console.log(myDate.getDate()); //獲取當前日(1-31)
    console.log(myDate.getDay()); //獲取當前星期X(0-6,0表明星期天)
    console.log(myDate.getTime()); //獲取當前時間(從1970.1.1開始的毫秒數)
    console.log(myDate.getHours()); //獲取當前小時數(0-23)
    console.log(myDate.getMinutes()); //獲取當前分鐘數(0-59)
    console.log(myDate.getSeconds()); //獲取當前秒數(0-59)
    console.log(myDate.getMilliseconds()); //獲取當前毫秒數(0-999)
    console.log(myDate.toLocaleDateString()); //獲取當前日期
    console.log(myDate.toLocaleTimeString()); //獲取當前時間
    console.log(myDate.toLocaleString()); //獲取日期與時間
}

reading

• https://javascriptissexy.com/understand-javascript-callback-functions-and-use-them/

MDN web docs

• https://developer.mozilla.org/en-US/docs/Web/API/Body/json
• https://developer.mozilla.org/en-US/docs/Web/API/Fetch_API/Using_Fetch
• https://devhints.io/js-fetch
• https://css-tricks.com/using-fetch/

jquery

• https://api.jquery.com/jquery.get/

選擇器

html 標籤選擇

$('div')

class 選擇器

$('.class_name')

id 選擇器

$('#id_name')

fetch

About the Request.mode'no-cors' (from MDN, emphasis mine)

Prevents the method from being anything other than HEAD, GET or POST. If any ServiceWorkers intercept these requests, they may not add or override any headers except for these. In addition, JavaScript may not access any properties of the resulting Response. This ensures that ServiceWorkers do not affect the semantics of the Web and prevents security and privacy issues arising from leaking data across domains.

So this will enable the request, but will make the Response as opaque, i.e, you won't be able to get anything from it, except knowing that the target is there.

Since you are trying to fetch a cross-origin domain, nothing much to do than a proxy routing.

var quizUrl = 'http://www.lipsum.com/';
fetch(quizUrl, {
  mode: 'no-cors',
  method: 'get'
}).then(function(response) {
  console.log(response.type)
}).catch(function(err) {
  console.log(err) // this won't trigger because there is no actual error
});

---

Notice you're dealing with a Response object. You need to basically read the response stream with Response.json() or Response.text() (or via other methods) in order to see your data. Otherwise your response body will always appear as a locked readable stream.

fetch('https://api.ipify.org?format=json')
.then(response=>response.json())
.then‌​(data=>{ console.log(data); })

If this gives you unexpected results, you may want to inspect your response with Postman.

---

fetch(url, {
    method: 'POST',
    headers: {
        'Accept': 'application/json',
        'Content-Type': 'application/json'
    },
    body: JSON.stringify({
        email: login,
        password: password,
    })
})
    .then(function (a) {
        return a.json(); // call the json method on the response to get JSON
    })
    .then(function (json) {
        console.log(json)
    })

Creating a div element in jQuery

---

div = $("<div>").html("Loading......");
$("body").prepend(div);

---

$('#parent').append('<div>hello</div>');    
// or
$('<div>hello</div>').appendTo('#parent');

---

jQuery('<div/>', {
    id: 'some-id',
    class: 'some-class',
    title: 'now this div has a title!'
}).appendTo('#mySelector');

---

jQuery(document.createElement("h1")).text("My H1 Text");

---

<div id="targetDIV" style="border: 1px solid Red">
    This text is surrounded by a DIV tag whose id is "targetDIV".
</div>


//Way 1: appendTo()
<script type="text/javascript">
    $("<div>hello stackoverflow users</div>").appendTo("#targetDIV"); //appendTo: Append at inside bottom
</script>

//Way 2: prependTo()
<script type="text/javascript">
    $("<div>Hello, Stack Overflow users</div>").prependTo("#targetDIV"); //prependTo: Append at inside top
</script>

//Way 3: html()
<script type="text/javascript">
    $("#targetDIV").html("<div>Hello, Stack Overflow users</div>"); //.html(): Clean HTML inside and append
</script>

//Way 4: append()
<script type="text/javascript">
    $("#targetDIV").append("<div>Hello, Stack Overflow users</div>"); //Same as appendTo
</script>

動態添加表格行

var $row = $('<tr>'+
      '<td>'+obj.Message+'</td>'+
      '<td>'+obj.Error+'</td>'+
      '<td>'+obj.Detail+'</td>'+
      '</tr>');    
if(obj.Type=='Error') {
    $row.append('<td>'+ obj.ErrorCode+'</td>');
}
$('table> tbody:last').append($row);