I’m trying to generate a page where the basic data to be shown can be interpreted different ways. So I’ve got a data format, and a few different JS scripts to generate HTML from the data. Each script contains a function called BuildView that inputs the data, parses it, and uses document.write to output HTML. The server-side scripts insert the right data and a script-include for the appropriate view into the page. Pretty straightforward, right?
Except nothing’s showing up in the page. So I decided to try and debug it with Firebug. Here’s the basic structure of the page:
<!DOCTYPE blah blah blah>
<html>
<head>blah blah blah</head>
<body>
<script type="text/javascript" src="/view.js"></script>
<div id='main-page'>
<h1 align="center">TITLE</h1>
<p align="left"><strong>Data: </strong>
<div id="data-view">
<script type="text/javascript">
BuildView('data from server');
</script>
</div>
</p>
</div>
</body></html>
Nothing shows up inside the data-view div. I loaded Firebug, switched to the script tab, put a breakpoint on the call to BuildView, and reloaded the page. It stopped at the breakpoint, and I hit F11 (Step Into), hoping to find myself inside the BuildView script to look around and see what’s going on. Instead… I got nothing. It just stepped over it and finished rendering the page. No errors are reported, but nothing’s actually happening.
If you can’t tell, I haven’t used Firebug before. What am I missing? How do I get the script debugger to actually debug into this script?
console.log()oralert()in the function to make sure it is actually firing.<script></script>tag in the div, move to the end of the</body>tag.BuildView()from the console to see if it works after the page has loaded.Let me know how those go.