What I think about better approach is:

{
    "author": "No Name",
    "title": "Wonderful Journey",
    "publishedDate": "17-03-2019",
    "country": "German",
    "city": "Berlin",
    "publisher": "Publisher Name",
    "chapters": [
        {
            "id": 1,
            "title": "Journey Begin",
            "pages": [
                {
                    "id": 1,
                    "picture": "City_Building.png",
                    "content": "Something else...",
                    "footnote": "Something important..."
                },
                {
                    "id": 2,
                    "picture": "City_Building.png",
                    "content": "Something else...",
                    "footnote": "Something important..."
                }
            ]
        }
    ]
}

You can save it as JSON file like book.json and call JSON file from Javascript like this:

var book = undefined,
    getBook = new XMLHttpRequest();

getBook.onreadystatechange(function() {
    if(this.readyState == 4 && this.status == 200) {
        book = JSON.parse(this.responseText);

        // get author of book
        console.log(book.author);

        // get content of chapter 1 page 1
        console.log(book.chapters[0].pages[0].content);

        // get footnote of chapter 1 page 2
        console.log(book.chapters[0].pages[1].footnote);
    };

getBook.open('GET', 'book.json');
getBook.send();

For information about ajax you can follow this link.