如何禁用chrome打开“新窗口”和“标签页”?

whhtz7ly  于 2022-12-06  发布在  Go
关注(0)|答案(2)|浏览(1549)

他们是一种通过Chrome浏览器设置将互联网上的所有页面保持在一个窗口中的方式吗?还是一个我可以这样做的插件?
我不希望在单击某些链接时网页在新选项卡和/或新窗口中打开。
如果有人有任何建议,请告诉我!,谢谢!!

<a href="http://www.bing.com" target="_blank">Opens a New Tab!</a>

        <i>Thtats not what i want..., I want this link to stay in same url bar.</i>

        <p>Like this!</p>
        <a class="click" href="http://www.bing.com">Click Here</a>
yvfmudvl

yvfmudvl1#

可能的方法:

一种方法是构建一个扩展,在每个页面中注入一个**content script**。这个内容脚本将解析DOM,删除锚元素的所有target属性,并将锚元素的所有target属性设置为_self

警告:

1.许多页面上都有动态插入的元素(包括锚元素)。
1.某些页面上存在动态变化的元素(包括锚元素)。
1.并非所有页面/选项卡都通过链接打开(例如,某些页面可能使用**window.open()**)。

溶液:

您可以使用**MutationObserver**来监看插入的锚元素或修改其target属性的锚点元素,并进行适当的调整。
如果通过其他方式打开的选项卡对您非常重要,您仍然需要注意这些选项卡(例如,window.open())(但这些情况应该非常非常少,所以可能不值得这么麻烦)。

示例代码:

清单.json:

{
    "manifest_version": 2,

    "name":    "Test Extension",
    "version": "0.0",

    "content_scripts": [{
        "matches":    ["*://*/*"],
        "js":         ["content.js"],
        "run_at":     "document_start",
        "all_frames": true
    }]
}

内容.js:

/* Define helper functions */
var processAnchor = function(a) {
    //if (a.hasAttribute('target')) {
    //    a.removeAttribute('target');
    //}
    a.setAttribute('target', '_self');
};

/* Define the observer for watching over inserted elements */
var insertedObserver = new MutationObserver(function(mutations) {
    mutations.forEach(function(m) {
        var inserted = [].slice.call(m.addedNodes);
        while (inserted.length > 0) {
            var elem = inserted.shift();
            [].slice.call(elem.children || []).forEach(function(el) {
                inserted.push(el);
            });
            if (elem.nodeName === 'A') {
                processAnchor(elem);
            }
        }
    });
});

/* Define the observer for watching over
 * modified attributes of anchor elements */
var modifiedObserver = new MutationObserver(function(mutations) {
    mutations.forEach(function(m) {
        if ((m.type === 'attributes') && (m.target.nodeName === 'A')) {
            processAnchor(m.target);
        }
    });
});

/* Start observing */
insertedObserver.observe(document.documentElement, {
    childList: true,
    subtree: true
});
modifiedObserver.observe(document.documentElement, {
    attributes: true,
    substree: true
});
7gyucuyw

7gyucuyw2#

这个问题已经有10年的历史了,但这里有一个稍微不同的方法,利用事件授权:

内容.ts:

const isAnchor = (target: EventTarget): target is HTMLAnchorElement =>
  !!target && target instanceof HTMLAnchorElement && target?.tagName?.toLowerCase() === 'a';

const findAnchor = (element: Node): HTMLAnchorElement | null => {
  let parent = element;

  while (parent !== null) {
    if (isAnchor(parent)) return parent;
    parent = parent.parentNode;
  }

  return null;
};

const callback = (e: MouseEvent): void => {
  if (!(e.target instanceof Node)) return;
  // traverse DOM tree until you find a parent anchor element
  const anchor = findAnchor(e.target);
  if (!anchor) return;
  // skip ones who already have _self
  if (!anchor.target || anchor.target === '_self') return;
  // cancel the original event
  e.preventDefault();
  // set target _self on the anchor which triggered navigation
  anchor.target = '_self';
  console.debug('target _self is set on anchor tag');
  // trigger the click again on the element which triggered it in the first place
  e.target.click();
};

window.addEventListener('click', callback);

相关问题