Как выбрать элементы внутри переменной с помощью jQuery?

Я пытаюсь создать простой браузер изображений для TinyMCE, который я использую в своей CMS. Как часть этого, мне нужно определить, выбрал ли пользователь существующее изображение, поэтому я могу отобразить форму "изменить" вместо "выбрать форму изображения".

var selected_html = ed.selection.getContent();
var $elem = $(selected_html);
console.log($elem);

Первая функция возвращает выбранный пользователем текст из окна редактора в виде строки HTML. Затем я хотел бы использовать jQuery (хотя простой javascript тоже в порядке), чтобы проверить, содержит ли эта строка тег img, прежде чем впоследствии захватить атрибуты src и title для редактирования.

Теперь я дошел до того, что html превратился в объект. Но после этого я не могу найти его для элемента img. Прочитав это (Как манипулировать HTML в переменной jQuery?), я попробовал:

$elem.find('img');

Но он просто появляется как объект undefined...

Я думаю, что мне не хватает чего-то довольно очевидного здесь (он опаздывает), но через час я все еще не могу понять, как захватить метку img из выделения.: (

Большое спасибо заранее.

Ответ 1

Поскольку <img> находится в корне объекта jQuery, вам нужно использовать .filter() вместо .find().

$elem.filter('img');

Метод .filter() смотрит на элемент на верхнем уровне объекта jQuery, а .find() ищет элементы, вложенные в любой элемент верхнего уровня.

Если вы не знаете заранее, где будет элемент-мишень, вы можете поместить HTML-код в обертку <div> для поиска. Таким образом, HTML-код никогда не будет на вершине.

var selected_html = ed.selection.getContent();
var $elem = $('<div>').html(selected_html);

var $img = $elem.find('img');

Ответ 2

Попробуйте увидеть, что действительно находится внутри вашей переменной $elem. Просто используйте console.log($elem), используя как Firefox, так и Firebug, и вы должны быть в состоянии управлять довольно хорошо!;)