web-dev-qa-db-fra.com

Comment vérifier si un élément avec id existe ou non dans jQuery?

Je génère une div dynamiquement et je dois vérifier si une div générée dynamiquement existe ou non? Comment puis je faire ça?

Actuellement, j'utilise ce qui suit qui ne détecte pas la div générée dynamiquement. Il détecte uniquement s'il existe déjà un élément dont l'identifiant est contenu dans le modèle HTML.

$(function() {
    var $mydiv = $("#liveGraph_id");
    if ($mydiv.length){
        alert("HHH");
    }
});

Comment puis-je détecter la div générée dynamiquement?

javascriptjqueryhtml
6
PythonEnthusiast

Si les observateurs de mutation ne sont pas une option en raison de leur compatibilité du navigateur , vous devrez impliquer le code qui insère réellement le <div> dans la document.

Une des options consiste à utiliser un événement personnalisé en tant que pub/sub .

$(document).on('document_change', function () {
    if (document.getElementById('liveGraph_id')) {
        // do what you need here
    }
});

// without a snippet to go on, assuming `.load()` for an example
$('#container').load('/path/to/content', function () {
    $(this).trigger('document_change');
});
10
Jonathan Lonowski

S'il est ajouté dynamiquement, vous devez tester à nouveau. Disons, un événement de clic

$("#element").click(function()
{
    if($("#liveGraph_id").length)
        alert("HHH");
});
3
Álvaro Martínez

Comment vous insérez votre div généré dynamique?

Cela fonctionne si vous le faites de la manière suivante:

var div = document.createElement('div');
div.id = 'liveGraph_id';
div.innerHTML = "i'm dynamic";
document.getElementsByTagName('body')[0].appendChild(div);
if ($(div).length > 0) {
    alert('exists'); //will give alert
}
if ($('#liveGraph_id').length > 0) {
    alert('exists'); //will give alert
}
if ($('#liveGraph_id_extra').length > 0) {
    alert('exists'); //wont give alert because it doesn't exist.
}

jsfiddle .

0
Eez

est très simple comme ça 

   if(document.getElementById("idname")){
//div exists 

}

ou 

    if(!document.getElementById("idname")){
//  don't exists
}
0
user3510753

Juste pour votre intérêt, vous pouvez également utiliser une collection en direct pour cela (elles sont fournies dans le cadre du DOM). Vous pouvez configurer une collection de tous les divs de la page (ceci peut être fait en tête même avant que le corps ne soit chargé):

var allDivs = document.getElementsByTagName('div');

Toute div avec un identifiant est disponible en tant que propriété nommée de la collection, vous pouvez donc faire:

if (allDivs.someId) {
  // div with someId exists
}

Si l'ID n'est pas un identifiant valide ou s'il est contenu dans une variable, utilisez la notation entre crochets. Quelques codes de jeu:

<button onclick="
  alert(!!allDivs.newDiv);
">Check for div</button>
<button onclick="
  var div = document.createElement('div');
  div.id = 'newDiv';
  document.body.appendChild(div);
">Add div</button>

Cliquez sur le bouton Check for div et vous obtiendrez false. Ajoutez la div en cliquant sur le bouton Ajouter une div et vérifiez à nouveau, vous obtiendrez true.

0
RobG