codeup-web-exercises/ajax-blog.html at main · samuelmartinez2/codeup-web-exercises · GitHub

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <link href="https://cdn.jsdelivr.net/npm/bootstrap@5.2.0-beta1/dist/css/bootstrap.min.css" rel="stylesheet" integrity="sha384-0evHe/X+R7YkIZDRvuzKMRqM+OrBnVFBL6DOitfPri4tjfHxaWutUpFmBp4vmVor" crossorigin="anonymous">
    <title>ajax-blog.html</title>
</head>
<body class="bg-warning">
<div id="post">

</div>

<script src="https://code.jquery.com/jquery-2.2.4.min.js" integrity="sha256-BbhdlvQf/xTY9gja0Dq3HiwQF8LaCRTXxZKRutelT44=" crossorigin="anonymous"></script>

<script>

    (function() {
        "use strict";

        $.get("/data/blog.json").done(function(data) {
            $("#post").html("");
            data.forEach(function(data) {
                let th= "<tr><th class='fw-bolder'>" + data.title + "</th></tr>"
                let td = "</tr class='d-flex'></td>"+ "<td class='text-primary text-capitalize '> " + data.categories + "<td class=''>" + data.date + "</td></tr>";
                let p = "<p class='fst-italic'>"+ data.content + "</p>"
                $('#post').append(th,td,p);
            })
        })


    })();
</script>

</body>
</html>