web-dev-qa-db-fra.com

JS: échec de l'exécution de 'getComputedStyle' sur 'Window': le paramètre n'est pas de type 'Element'

En bref: j'essaie de comprendre la signification de ce TypeError: Échec de l'exécution de 'getComputedStyle' sur 'Window': le paramètre 1 n'est pas de type 'Element' L'erreur apparaît lors du déjeuner VisualEditor de Mediawiki, comme on peut le voir ici:

http://www.wiki.org.il/index.php?title=new-page&veaction=edit

L'erreur ne permet pas de créer de nouvelles pages ou de modifier le wiki de manière anonyme. Cependant, avec l'utilisation d'un skin différent, l'erreur disparaît:

http://www.wiki.org.il/index.php/Main_Page?useskin=vector

Le wiki fonctionne sur 1.25alpha.

javascriptmediawikitypeerrorvisual-editorgetcomputedstyle
19
Kwiki

J'ai eu cette même erreur en montrant. Lorsque j'ai remplacé le sélecteur jQuery par du JavaScript normal, l'erreur a été corrigée.

var this_id = $(this).attr('id');

Remplacer:

getComputedStyle( $('#'+this_id)[0], "")

Avec:

getComputedStyle( document.getElementById(this_id), "")
16
Anish

Pour ceux qui ont obtenu cette erreur dans AngularJS et non jQuery:

Je l'ai eu dans AngularJS v1.5.8 en essayant de ng-include une type="text/ng-template" qui n'existait pas.

 <div ng-include="tab.content">...</div>

Assurez-vous que lorsque vous utilisez ng-include, les données de cette directive pointent vers une page/section réelle. Sinon, vous vouliez probablement:

<div>{{tab.content}}</div>
2
J.D. Mallen

Dans mon cas, j'utilisais ClassName.

getComputedStyle( document.getElementsByClassName(this_id)) //error

Cela fonctionnera également sans 2ème argument " ".

Voici mon code de course complet:

function changeFontSize(target) {

  var minmax = document.getElementById("minmax");

  var computedStyle = window.getComputedStyle
        ? getComputedStyle(minmax) // Standards
        : minmax.currentStyle;     // Old IE

  var fontSize;

  if (computedStyle) { // This will be true on nearly all browsers
      fontSize = parseFloat(computedStyle && computedStyle.fontSize);

      if (target == "sizePlus") {
        if(fontSize<20){
        fontSize += 5;
        }

      } else if (target == "sizeMinus") {
        if(fontSize>15){
        fontSize -= 5;
        }
      }
      minmax.style.fontSize = fontSize + "px";
  }
}


onclick= "changeFontSize(this.id)"
1
Pushpender Singh

Le message d'erreur indique que getComputedStyle requiert que le paramètre soit de type Element. Vous le recevez car le paramètre a un type incorrect.

Le cas le plus courant est que vous essayez de passer un élément qui n'existe pas comme argument:

my_element = document.querySelector(#non_existing_id);

Maintenant que cet élément est null, cela entraînera l'erreur mentionnée:

my_style = window.getComputedStyle(my_element);

S'il n'est pas possible d'obtenir toujours correctement l'élément, vous pouvez, par exemple, utiliser la commande suivante pour terminer la fonction si querySelector n'a trouvé aucune correspondance:

if (my_element === null) return;
1
Ryszard Jędraszyk

J'ai eu la même erreur sur mon projet Angular6. aucune de ces solutions ne semblait fonctionner pour moi. s'est avéré que le problème était dû à un élément spécifié comme dropdown mais qu'il n'avait pas d'options de liste déroulante. jetez un œil au code ci-dessous:

<span class="nav-link" id="navbarDropdownMenuLink" data-toggle="dropdown"
                          aria-haspopup="true" aria-expanded="false">
                        <i class="material-icons "
                           style="font-size: 2rem">notifications</i>
                        <span class="notification"></span>
                        <p>
                            <span class="d-lg-none d-md-block">Some Actions</span>
                        </p>
                    </span>
                    <div class="dropdown-menu dropdown-menu-left"
                         *ngIf="global.localStorageItem('isInSadHich')"
                         aria-labelledby="navbarDropdownMenuLink">
                                        <a class="dropdown-item" href="#">You have 5 new tasks</a>
                                        <a class="dropdown-item" href="#">You're now friend with Andrew</a>
                                        <a class="dropdown-item" href="#">Another Notification</a>
                                        <a class="dropdown-item" href="#">Another One</a>
                    </div>

suppression du code data-toggle="dropdown" aria-haspopup="true" aria-expanded="false" résolu le problème.

Je pense moi-même qu'à chaque clic sur le premier élément span, la portée devrait définir le style pour les enfants déroulants qui n'existaient pas dans la plage parent, donc cela a jeté une erreur.

0
Far