javascript 使用javascript重新加载div的内容

声明:本页面是StackOverFlow热门问题的中英对照翻译,遵循CC BY-SA 4.0协议,如果您需要使用它,必须同样遵循CC BY-SA许可,注明原文地址和作者信息,同时你必须将它归于原作者(不是我):StackOverFlow 原文地址: http://stackoverflow.com/questions/7218070/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me): StackOverFlow

提示:将鼠标放在中文语句上可以显示对应的英文。显示中英文
时间:2020-10-25 23:20:41  来源:igfitidea点击:

reload contents of div using javascript

javascripthtmlreload

提问by Eng.Fouad

I'm trying to reload the contents of divtag on button-click. I can do it with using:

我正在尝试div在单击按钮时重新加载标签的内容。我可以使用以下方法来做到这一点:

function reload_div()
{   
    document.getElementById('div_id').innerHTML = 'blah blah blah';
}

but the problem is, that divtag contains thousands of lines and when I try to acomplish the div-reloading with previous function, the browser will be freezed. I was searching for a solution on stackoverflow but all what I found is with using ajax or jquery and I haven't used those library before. So, can I reload the div contents using javascript and html only? Thanks.

但问题是,该div标签包含数千行,当我尝试使用以前的功能完成 div 重新加载时,浏览器将被冻结。我正在寻找有关 stackoverflow 的解决方案,但我发现的所有内容都是使用 ajax 或 jquery 的,我以前从未使用过这些库。那么,我可以仅使用 javascript 和 html 重新加载 div 内容吗?谢谢。

采纳答案by Donnie

I'm not sure why you would want to load so much content with javascript in the first place, but you could always put the javascript in an external file so the browser could cache it. That should help if it's the browser loading the script that is causing the page to freeze up.

我不确定为什么您首先要使用 javascript 加载这么多内容,但是您始终可以将 javascript 放在外部文件中,以便浏览器可以缓存它。如果是浏览器加载导致页面冻结的脚本,那应该会有所帮助。

Feel free to post more code and I'll take a look if that doesn't do it for you.

随意发布更多代码,如果这不适合您,我会看看。

回答by kevinji

You could try using removeChild, in a variety of ways (I'm not sure whether the following code would freeze the browser or not, but it's worth a try):

您可以尝试removeChild以多种方式使用,(我不确定以下代码是否会冻结浏览器,但值得一试):

1)

1)

function reload_div() {
    // Remove all child nodes from div first
    var div = document.getElementById('div_id');
    while (div.firstChild) {
        div.removeChild(div.firstChild);
    }

    document.getElementById('div_id').innerHTML = 'blah blah blah';
}

2)

2)

function reload_div() {
    // Remove the div first
    var parent = document.getElementById('div_id').parentNode;
    parent.removeChild(document.getElementById('div_id'));

    // Recreate the div
    var div = document.createElement('div');
    div.setAttribute('id', 'div_id');

    // Append the div to the parent
    parent.appendChild(div);

    document.getElementById('div_id').innerHTML = 'blah blah blah';
}

回答by alt

You can't exactly "refresh" the content I don't think, I've never heard of that. (however, I'm not an expert) However, I have heard of switching out the content with javascript, try something link this:

你不能完全“刷新”我不认为的内容,我从来没有听说过。(但是,我不是专家)但是,我听说过使用 javascript 切换内容,请尝试链接以下内容:

here's your button & div with content:

这是带有内容的按钮和 div:

<a href="divrefresh()">Refresh it!</a>
<div id="content"><p>Some Stuff!</p></div>

Here's the js underlying, you've got a function which is used above in the link.

这是底层的js,你有一个在链接中使用的函数。

function divrefresh() {
     document.getElementById('content').innerHTML = "Some new stuff!"
}

ETA: Oops, I see the rest of your post now. I'm not sure why that would freeze the browser. Try jQuery, it's really easy to use, that's why everyone loves it. If you've found a jQuery solution, I wouldn't hesitate to try it out! Post it and I can help you.

ETA:哎呀,我现在看到你帖子的其余部分了。我不确定为什么会冻结浏览器。试试jQuery,它真的很容易使用,这就是为什么每个人都喜欢它。如果您找到了 jQuery 解决方案,我会毫不犹豫地尝试一下!发布它,我可以帮助你。

If you REALLY don't want to use jQuery or Ajax, then I think the only other solution is to put the lines in their own HTML document, have an iframe, and refresh the iframe.

如果你真的不想使用 jQuery 或 Ajax,那么我认为唯一的其他解决方案是将这些行放在他们自己的 HTML 文档中,有一个 iframe,然后刷新 iframe。