使用 Javascript 覆盖或禁用元刷新标记

声明:本页面是StackOverFlow热门问题的中英对照翻译,遵循CC BY-SA 4.0协议,如果您需要使用它,必须同样遵循CC BY-SA许可,注明原文地址和作者信息,同时你必须将它归于原作者(不是我):StackOverFlow 原文地址: http://stackoverflow.com/questions/3252743/
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-08-23 03:53:18  来源:igfitidea点击:

Using Javascript to override or disable meta refresh tag

javascripthtmlajaxmeta-tags

提问by Elias Zamaria

I have a website, where I am trying to use Ajax to update some stuff on the page without reloading it. However, there is a good chance that many of my users will be using mobile browsers that don't support Javascript so I am trying to design the page with meta refresh tags, that somehow work only for users without Javascript. Is there any way to do this?

我有一个网站,我正在尝试使用 Ajax 更新页面上的某些内容,而无需重新加载它。但是,很有可能我的许多用户将使用不支持 Javascript 的移动浏览器,因此我尝试使用元刷新标签设计页面,该标签仅适用于没有 Javascript 的用户。有没有办法做到这一点?

I tried putting the tag within a noscript element, but my primitive cell phone browser wouldn't acknowledge it. I am thinking of maybe setting a cookie to remember if the user's browser supports Javascript, or having one version of the page that works without Javascript, and tries to use Javascript to redirect the user to a more sophisticated version, but I am wondering if there is a more elegant way to do it. Does anyone have any ideas?

我尝试将标签放在 noscript 元素中,但我的原始手机浏览器不承认它。我正在考虑设置一个 cookie 来记住用户的浏览器是否支持 Javascript,或者有一个版本的页面可以在没有 Javascript 的情况下工作,并尝试使用 Javascript 将用户重定向到更复杂的版本,但我想知道是否有是一种更优雅的方式来做到这一点。有没有人有任何想法?

回答by Shaun

I've found that the noscript tag works quite nicely for this. For example, you can place this just after you closethe head element:

我发现 noscript 标签对此非常有效。例如,您可以在关闭head 元素后放置它:

<noscript>
    <meta http-equiv="refresh" content="5;URL=http://www.example.com">
</noscript>

No need to remove the meta tag with script, since a browser that has script support will ignore everything inside the noscript element.

无需使用脚本删除元标记,因为具有脚本支持的浏览器将忽略 noscript 元素中的所有内容。

回答by Hrishi

You cannot override meta refresh tag with JavaScript.

您不能使用 JavaScript 覆盖元刷新标记。

However you can do this

但是你可以这样做

Suppose your page is at ->

假设您的页面位于 ->

http://example.net/mike.htmlPut the following code there->

http://example.net/mike.html把下面的代码放在那里->

<script type="text/javascript">
window.location = 'http://example.net/mike/for_Those_With_JavaScript_Enabled.html';
</script>

回答by XP1

Unfortunately, from @bluesmoon's answer, manipulating the DOM does not work anymore.

不幸的是,从@bluesmoon 的回答来看,操作 DOM 不再有效。

The workaround is to retrieve the original markup, find and replace the meta refresh element, and then write the new document with the replaced markup.

解决方法是检索原始标记,找到并替换元刷新元素,然后使用替换的标记编写新文档。

I am not sure how to retrieve the original markup using JavaScript except for sending an additional request using XMLHttpRequest.

我不知道如何使用 JavaScript 检索原始标记,除了使用XMLHttpRequest.

In Opera, here is what I am using:

在 Opera 中,这是我正在使用的:

Disable meta refresh 1.00.js:

Disable meta refresh 1.00.js

// ==UserScript==
// @name Disable meta refresh
// @version 1.00
// @description Disables meta refresh.
// @namespace https://stackoverflow.com/questions/3252743/using-javascript-to-override-or-disable-meta-refresh-tag/13656851#13656851
// @copyright 2012
// @author XP1
// @homepage https://github.com/XP1/
// @license Apache License, Version 2.0; http://www.apache.org/licenses/LICENSE-2.0
// @include http*://example.com/*
// @include http*://*.example.com/*
// ==/UserScript==

/*
 * Copyright 2012 XP1
 *
 * Licensed under the Apache License, Version 2.0 (the "License");
 * you may not use this file except in compliance with the License.
 * You may obtain a copy of the License at
 *
 *     http://www.apache.org/licenses/LICENSE-2.0
 *
 * Unless required by applicable law or agreed to in writing, software
 * distributed under the License is distributed on an "AS IS" BASIS,
 * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
 * See the License for the specific language governing permissions and
 * limitations under the License.
 */

/*jslint browser: true, vars: true, maxerr: 50, indent: 4 */
(function (window, XMLHttpRequest) {
    "use strict";

    if (window.self !== window.top) {
        return;
    }

    window.stop();

    var uri = window.location.href;

    var request = new XMLHttpRequest();
    request.open("GET", uri, false);
    request.send(null);

    if (!(request.readyState === 4 && request.status === 200)) {
        return;
    }

    var markup = request.responseText;
    markup = markup.replace(/<meta http-equiv="refresh".*\/?>/gi, "");

    var document = window.document;
    document.open();
    document.write(markup);
    document.close();
}(this, this.XMLHttpRequest));

Opera also has a built-in feature that disables meta refreshes. No need for JavaScript.

Opera 还具有禁用元刷新的内置功能。不需要 JavaScript。

  • Right click on webpage > Edit Site Preferences... > Network > Disable "Enable automatic redirection" > OK.
  • 右键单击网页 > 编辑站点首选项... > 网络 > 禁用“启用自动重定向”> 确定。

回答by Amresh

This worked for me wonderful! (tried in chrome)

这对我来说太棒了!(在铬中试过)

window.stop();

回答by gblazex

Meta tags are awful in this case. What about search engines??

在这种情况下,元标记很糟糕。搜索引擎呢??

What you should do is to make it something like I've outlined here. Your links should point to full working sites as if it were a web 2.0 page. Then with event handlers (onclick) you enhance the user experience by using ajax.

你应该做的是让它像我在这里概述的那样。您的链接应该指向完整的工作站点,就好像它是一个 Web 2.0 页面一样。然后通过事件处理程序 (onclick) 使用 ajax 增强用户体验。

So ajax users will not go to links, the link is rather processed when clicked and sent an ajax request to the exact same url but with an ajax GET parameter.

因此,ajax 用户不会转到链接,而是在单击时处理链接,并将 ajax 请求发送到完全相同的 url,但带有 ajax GET 参数。

Now on the server side you have to be able to generate the whole siteby some method. If it is an ajax request you send the related content. If it is not an ajax request, yo generate the full site with the related part embedded.

现在在服务器端,您必须能够通过某种方法生成整个站点。如果是ajax请求,则发送相关内容。如果不是一个Ajax请求,哟生成完整的网站与相关部分嵌入

Your site will be SEO friendly, availableto mobile users, and progressively enhancedfor people on modern browsers and platforms. Finally ajax generated hash links will be usable, even as links.

您的网站将是SEO 友好的可供移动用户使用,并逐渐为现代浏览器和平台上的人们增强。最后,ajax 生成的哈希链接将可用,甚至可以用作链接。

Awesomeness. :)

了不起。:)

回答by bluesmoon

Just remove the meta tag with javascript:

只需使用 javascript 删除元标记:

<meta http-equiv="refresh" content="2;http://new-url/" id="meta-refresh">

<script type="text/javascript">
var mr = document.getElementById("meta-refresh");
mr.parentNode.removeChild(mr);
</script>

I've set the refresh timeout to 2 seconds above just as an example. You could probably get away with 1 second as well, but don't set it to 0 because the javascript won't get a chance to execute in that case. 0 is also annoying because it breaks back-button usability.

作为示例,我已将刷新超时设置为 2 秒以上。您也可以避开 1 秒,但不要将其设置为 0,因为在这种情况下 javascript 将没有机会执行。0 也很烦人,因为它破坏了后退按钮的可用性。

Edit 2012-10-23This does not appear to work any more. The node still gets removed, but it appears that browsers parse and hold in memory all meta tags any way.

编辑 2012-10-23这似乎不再起作用了。该节点仍然被删除,但浏览器似乎以任何方式解析并在内存中保存所有元标记。

回答by Jhong

I agree that meta refresh is not the right way forward here. In addition to galambalazs' link, search on "progressive enhancement".

我同意元刷新在这里不是正确的方法。除了 galambalazs 的链接,搜索“渐进增强”。

However, in the spirit of answering the question, you could try the following. It's untested, may not work in all browsers, but should be along the right lines:

但是,本着回答问题的精神,您可以尝试以下操作。它未经测试,可能不适用于所有浏览器,但应该是正确的:

var i, refAttr;
var metaTags = document.getElementsByTagName('meta');
for i in metaTags {
    if( (refAttr = metaTags[i].getAttribute("http-equiv")) && (refAttr == 'refresh') ) {
        metaTags[i].parentNode.removeChild(metaTags[i]);
    }
}

Whether removing it would stop the browser from refreshing in time remains to be seen.

删除它是否会阻止浏览器及时刷新还有待观察。

回答by Mr Lindsay George

This is an example of what I use and it works perfectly (especially on Firefox)!

这是我使用的一个示例,它运行良好(尤其是在 Firefox 上)!

<html><head>
<meta http-equiv="content-type" content="text/html;charset=utf-8">
<title>Redirecting</title>
</head>
<body onload="location.replace('http://www.live.comeseetv.com'+document.location.hash)">
<a href="http://www.live.comeseetv.com">Redirecting you to http://www.live.comeseetv.com</a>
</body></html>