Cómo seleccionar un elemento por ID usando jQuery

Estoy tratando de usar el siguiente código jQuery para agregar un div con class col_box dentro de col_left div:

$('#col_left').add('div').addClass('col_box');

Mi árbol DOM se ve así:

<div id="header">Header</div>
    <div class="col_container">
            <div id="col_left">
                <div class="col_box">A</div>
                <div class="col_box">B</div>
            </div>
    </div>

Sin embargo, el código jQuery no funciona. Agrega la clase col_box a cada elemento de la página.

preguntado el 27 de agosto de 11 a las 20:08

¿Qué se supone que debe hacer ese código? Si agrega un div vacío, ¿cómo se supone que aparecerá? -

-1. Dedique tiempo a leer la documentación de jQuery, a leer algunos tutoriales, etc. Esta es una pregunta tan básica que está claro que no ha hecho ninguna de esas cosas. -

Lea la documentación antes de usar el método: api.jquery.com/add -

4 Respuestas

$('#col_left').add('div') está agregando todo <div> elementos a la selección original. Intenta usar $('#col_left').append('<div class="col_box"></div>') en su lugar (o .prepend).

Respondido 28 ago 11, 00:08

$('#col_left').add('div') significa lo mismo que $('#col_left, div'). es decir, "El elemento con el id 'col_left' y todos los elementos div.

Si desea seleccionar los divs que son hijos de col_left, simplemente use un combinador de niños.

$('#col_left > div').addClass('col_box')

Respondido 28 ago 11, 00:08

Quiero agregar un elemento div a col_left, no seleccionar los divs secundarios. - tom

puedes usar

.append se agrega después del objetivo coincidente

$('#col_left').append(
$("<div/>",{class:'col_box'}).html("div added")
);

aquí está el violín http://jsfiddle.net/R65cn/4/

Respondido 28 ago 11, 00:08

.add() agrega un selector a la selección, no crea ni agrega elementos.

  • $('#col_left') significa * seleccionar id de elemento col_left *
  • .add('div') significa agregue todos los divs de la página la selección

    Entonces, en este punto, ha seleccionado #col_left y todos los divs.

  • .addClass('col_box') significa * agregar la clase col_box a todos los elementos de la selección *.

A continuación se explica cómo crear un div y agregarlo a #col_left:

$('<div></div>').addClass('col_box').appendTo('#col_left');

o:

$('<div class="col_box"></div>').appendTo('#col_left');

Respondido 28 ago 11, 00:08

No es la respuesta que estás buscando? Examinar otras preguntas etiquetadas or haz tu propia pregunta.