小屏加载时移除链接target属性失效问题求助

我最近碰到个棘手的问题：想在屏幕宽度≤604px的时候，移除文章内指定链接的target属性——这样点击链接就会在当前浏览器窗口打开，而不是跳转到预设的iframe里，但试了好几种写法都没生效。我已经确认浏览器窗口是符合小屏尺寸的，也用Ctrl+R强制刷新过页面，可链接的target属性始终纹丝不动。

我的需求 #

希望把下面这个链接的target属性去掉：

<a href="/glossaire/une-demarche-pionniere/" onclick="document.querySelector(&quot;iframe&quot;).removeAttribute(&quot;hidden&quot;)" target="iframe_glossary">démarche pionnière</a>

我尝试过的代码 #

第一种写法：

<script>
if (screen.availWidth <= 604) {
  document.querySelector('p a').removeAttribute('target');
}
</script>

后来我又在<head>里写了简化版的代码，同样没效果：

<script>$(window).Width<=604&&document.querySelector("p a").removeAttribute("target")</script>

补充页面结构 #

下面是我当前页面的完整结构，方便大家排查问题：

<html lang="fr">
<head>
  <script src="/livereload.js?mindelay=10&v=2&port=1313&path=livereload" data-no-instant="" defer=""></script>
  <script>$(window).Width<=604&&document.querySelector("p a").removeAttribute("target")</script>
</head>
<body class="page-template-default page">
<header id="header"><a href="http://localhost:1313/" id="logo"></a></header>
<div id=content>
<main id="page" class="page-content">
<article class="page-post">
<div class="post-ctt">
<p>C’est une
<a href="/glossaire/une-demarche-pionniere/" onclick="document.querySelector(&quot;iframe&quot;).removeAttribute(&quot;hidden&quot;)" target="iframe_glossary">démarche pionnière</a>
<iframe hidden="" name="iframe_glossary" allow-same-origin="" seamless=""></iframe>
<button onclick="document.querySelector(&quot;iframe&quot;).setAttribute(&quot;hidden&quot;,&quot;hidden&quot;)">☒</button>
</div>
</article>
</main>
</div>
</body>
</html>

有没有大佬能帮我看看问题出在哪？是代码执行时机不对？还是选择器或者窗口宽度的判断方式有问题？

备注：内容来源于stack exchange，提问作者Mehdi Saada