Changing the content of an html object using JavaScript
I have looked high and low for the correct syntax for changing the content of an object using JavaScript and have yet开发者_运维技巧 to find anything.
How would I go about opening a html within an object using JavaScript?
If anyone can help that would be great thanks.
To show another page within an element using Javascript you'd have to create an iFrame, as such:
<div id='test'></div>
<script type='text/javascript'>
window.onload = function()
{
var src = 'http://www.google.com';
document.getElementById('test').innerHTML = '<iframe src="'+src+'" />';
}
</script>
With Jquery you can rest assure that it will work correctly in all modern and not so modern browsers: http://api.jquery.com/html/
<div class="demo-container"><div class="demo-box">Demonstration Box</div></div>
$('div.demo-container').html('<p>All new content. <em>You bet!</em></p>');
Use the innerHTML property.
Plenty of information on Google: http://www.tizag.com/javascriptT/javascript-innerHTML.php
Ok, for a new page you have to do something like
<script>
function OpenUrl(value)
{
document.all.myFrame.src=value;
document.all.myFrame.style.visibility="visible";
}
</script>
Then inside the HTML:
<body>
...
<iframe id="myFrame" style="visibility:hidden;"></iframe>
...
</body>
Then have an element which triggers the function, like a button or image:
<input type="button" value="Load" onclick="return OpenUrl('mywebsite')">
I just wanted to add that this can be done with an object tag. The trick is that you have to create a new object for it to update with the new html.
function resetObj (linkToNewPage, idOfObjectToChange) {
var clone = document.getElementById(idOfObjectToChange).cloneNode(true);
clone.data = linkToNewPage;
var placeHolder = document.getElementById(idOfObjectToChange).parentNode;
placeHolder.removeChild(document.getElementById(idOfObjectToChange));
placeHolder.appendChild(clone);
}
Object elements don't update with new 'data' information for some reason without doing this. Basically you're cloning the node, applying the new information, then get the parent of the old node, remove the old node, append the new node.
加载中,请稍侯......
精彩评论