пытаясь получить URL-адрес изображения внутри детей div

Question

Я создаю расширение, которое захватывает URL-адрес изображения внутри элемента "uCW" на странице HTML.

В настоящее время у меня есть:

var uCW = jNode.closest("div._q7o");
var image = uCW[0].children[1].getElementsByTagName("img")[0].src;
console.log(image);

, который находит образ, зайдя в div / children и потянув изображение. К сожалению, этот метод проблематичен c, так как он перестает работать, если дети меняются, что они регулярно делают.

Вместо этого я хочу выбрать изображение, выполнив поиск по div и всем его дочерним элементам (их много) для первого изображения / строки, которая начинается с "https://external" (все изображения, которые я хочу, начинаются таким образом, и это, похоже, не меняется.) Это то, что я пробовал:

var uCW = jNode.closest("div._q7o");
var image = $(uCW).find([name^="https://external"]).src;
console.log(image);

Это не работает. Консоль просто выводит «undefined».

Answer 1

Вы можете сделать это следующим образом, если ucw является именем класса (если это идентификатор, вместо этого вы должны написать $("#ucw")):

var image = $(".ucw").find('[src^="https://external"]').attr("src");
console.log(image);

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<div class="ucw">
   <img src="https://external/1.jpg"/>
</div>

Если у ваших изображений есть атрибут имени с источником изображения в качестве значения, вы также можете настроить свою попытку извлечения изображений с помощью их атрибута имени, подобного вам. сделал:

 var image = $(".ucw").find('[name^="https://external"]').attr("src");