document.getElementById
、$("#id")
ou par toute autre méthode DOM/sélecteur jQuery??
Exemples de questions?:
.val()
、.html()
、.text()
) 返回 undefined
null
entra?nent l'erreur suivante?: Uncaught TypeError?: Impossible de définir la propriété nulle '...'
Uncaught TypeError?: Impossible de définir la propriété sur null (paramètre '...')
Uncaught TypeError?: Impossible de lire la propriété '...' de null
Uncaught TypeError?: Impossible de lire la propriété de null (lire '...')
La forme la plus courante est :
Uncaught TypeError?: impossible de définir la propriété 'onclick' sur null
Uncaught TypeError?: Impossible de lire la propriété 'addEventListener' de null
Uncaught TypeError?: impossible de lire la propriété ? style ? de null
Court : Parce que l'élément que vous recherchez n'existe pas encore dans le document.
Pour le reste de cette réponse, j'utiliserai tel que getElementById
,但這同樣適用于 getElementsByTagName
, querySelector, ainsi que toute autre méthode DOM pour sélectionner des éléments.
Raisons possibles
Trois raisons pour lesquelles l'élémentpourrait ne pas exister?:
L'élément avec l'ID transmis n'existe pas dans le document. Vous devez vérifier que l'ID que vous transmettez getElementById
correspond réellement à l'ID d'un élément existant dans le HTML (généré) et que vous n'avez pas mal orthographié l'ID (les ID sont sensibles à la casse?!).
Si vous utilisez getElementById
,請確保您僅提供元素的 ID(例如 document.getElemntById("the-id “)
)。如果您使用的方法接受 CSS 選擇器(例如 querySelector
),請確保在 ID 之前包含 #
以表明您正在查找ID(例如,document.querySelector("#the-id")
)。您不能不將#
與getElementById
一起使用,并且必須將其與querySelector
一起使用和類似的。另請注意,如果 ID 中包含在 CSS 標識符(例如 .
;包含 .
字符的 id
屬性是不好的做法,但有效),您必須使用 querySelector
(document.querySelector("#the\.id")
)) 時轉(zhuǎn)義這些內(nèi)容,但使用 getElementById
( >document.getElementById("the.id")
, assurez-vous de
document.getElemntById("the-id ")
). Si vous utilisez une méthode qui accepte un sélecteur CSS (par exemple, querySelector
), veillez à inclure #
avant l'ID pour indiquer que vous recherchez l'ID ( par exemple, document.querySelector ("#the-id")
). Vous ne pouvez pas utiliser #
avec getElementById
, et
querySelector
et similaire. Notez également que si l'ID contient des caractères non valides dans l' (par exemple .
?; un attribut id
contenant des caractères .
est une mauvaise pratique, mais valide), vous devez utiliser un querySelector (document.querySelector("#the\.id")
)) , mais utilisez ( >document.getElementById("the.id")
). iframe
中(這是它自己的文檔)。當您搜索包含 iframe
. iframe
或類似文件中),您需要查看 iframe
中的文檔,而不是父文檔,也許可以通過獲取 iframe
元素并使用其 contentDocument
La deuxième raison - elle n'est pas encore là - est très courante. Les navigateurs analysent et traitent le HTML de haut en bas. Cela signifie que tous les appels à l'élément DOM effectués avant que l'élément DOM n'apparaisse dans le code HTML échoueront.
Considérons l'exemple suivant?:
sssccc
div
出現(xiàn)在script
之后。執(zhí)行腳本時,該元素尚不存在,并且 getElementById
將返回 null
.
jQuery
Cela s'applique également à tous les sélecteurs jQuery. Si vous mal épelezvos sélecteurs, ou si vous essayez de les sélectionner avant qu'ils n'existent réellement, jQuery ne les trouvera pas.
Un problème supplémentaire survient lorsque jQuery n'est pas trouvé parce que vous avez chargé le script sans protocole et que vous l'exécutez à partir du système de fichiers?:
sssccc
Cette syntaxe est utilisée pour permettre le chargement des scripts via HTTPS sur les pages avec le protocole https:// et la version HTTP sur les pages avec le protocole http://
Cela a pour effet secondaire malheureux d'essayer de charger file://somecdn.somewhere.com...
Solution
Avant d'appeler getElementById
(ou toute méthode DOM d'ailleurs), assurez-vous que l'élément auquel vous souhaitez accéder existe, c'est-à-dire que le DOM est chargé.
Placez simplement JavaScript après l'élément DOM correspondant pour vous en assurer
sssccc
Dans ce cas, vous pouvez également placer le code avant la balise body de fermeture (
L'élément que vous essayez de trouver n'est pas dans le DOM lorsque votre script s'exécute.
L'emplacement d'un script qui s'appuie sur le DOM peut avoir un impact profond sur son comportement. Les navigateurs analysent les documents HTML de haut en bas. Les éléments sont ajoutés au DOM et les scripts sont (généralement) exécutés lorsqu'ils sont rencontrés. Cela signifie que l’ordre compte. Souvent, les scripts ne peuvent pas trouver les éléments qui apparaissent plus tard dans le balisage car ils n'ont pas encore été ajoutés au DOM.
Considérez le balisage suivant?: le script n°?1 ne trouve pas sssccc