Replacing <div> content by external html file with Javascript

Question

I'm a bit rusty on my HTML and JavaScript and can't seem to get this one right. The simple approach I took works fine, but I want to be more flexible. Here is the simple approach:

<head>

    <script>
        function loadContent(a){
            document.getElementById(a).innerHTML='<object type="text/html" data="home.html" ></object>';
        }
    </script>
</head>

<body>

    <div id="topBar"> 
        <a href ="#" onclick="loadContent('content')"> HOME </a> 
    </div>
    <div id ="content"> </div>

</body>

This works fine. However, I also want to get the desired document as a variable of the function. Here is where I get stuck. Probably has something to do with the "" and '', but I have not been able to find the answer. Here is my 'desired' situation:

<head>

    <script>
        function loadContent(a, b){
            document.getElementById(a).innerHTML= b;
        }
    </script>
</head>

<body>

    <div id="topBar"> 
        <a href ="#" onclick="loadContent('content', '<object type='text/html' data='home.html' ></object>')"> HOME </a> 
    </div>
    <div id ="content"> </div>

</body>

Can anybody help me out?

Thanx

Roy M J · Accepted Answer · 2015-07-17 16:52:29Z

3

Try:

<a href ="#" onclick="loadContent('content', '<object type=\'text/html\' data=\'home.html\' ></object>')"> HOME </a>

Basically just escape the quotes.

answered Jul 17, 2015 at 16:52

Roy M J

6,9367 gold badges54 silver badges79 bronze badges

Sign up to request clarification or add additional context in comments.

1 Comment

Roy M J Over a year ago

Cheers. Do accept the answer as solution if it worked..:)

Collectives™ on Stack Overflow

Replacing <div> content by external html file with Javascript

1 Answer 1

1 Comment

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

1 Comment

Your Answer

Sign up or log in

Post as a guest

Related