Использование javascript / jQuery для получения значений атрибутов из строки HTML - PullRequest
Новая
       0

Использование javascript / jQuery для получения значений атрибутов из строки HTML

8 голосов
/ 14 сентября 2010

У меня есть строка HTML, которая содержит текст и изображения, например, 

<p>...</p>
<img src="..." />
<p>...</p>

Мне нужно получить атрибут src первого изображения. Изображение может появиться или не появиться после <p>, и может быть более одного изображения или вообще отсутствует.

Первоначально я попытался добавить строку в DOM и выполнить фильтрацию. Но, если я сделаю это, браузер запросит все внешние ресурсы. В моей ситуации это добавляет много ненужных накладных расходов.

Мой первоначальный подход: 

var holder = $('<div></div>'); 

holder.html(content);

var src = holder.find('img:first').attr('src');

Как я могу получить src первого изображения без добавления HTML? Нужно ли использовать регулярное выражение или есть лучший способ?

Решение должно быть основано на javascript / jQuery - я не использую серверные языки.

Мой вопрос очень похож на: http://forum.jquery.com/topic/parsing-html-without-retrieving-external-resources

Спасибо

Ответы [ 4 ]

12 голосов
/ 14 сентября 2010

Это 

$("<p><blargh src='whatever.jpg' /></p>").find("blargh:first").attr("src")

возвращает whatever.jpg, поэтому я думаю, что вы можете попробовать 

$(content.replace(/<img/gi, "<blargh")).find("blargh:first").attr("src")

Редактировать

/<img/gi вместо"<img"

5 голосов
/ 14 сентября 2010

Это должно работать: 

<html>
<head>
    <script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.4.2/jquery.min.js"></script>
    <script type="text/javascript">
        //Document Ready: Everything inside this function fires after the page is loaded
        $(document).ready(function () {
                    //Your html string
            var t = "<p><img src='test.jpg'/></p>"
            alert($(t).find('img:first').attr('src'));
        });
    </script>
</head>
<body>
</body>
</html>
2 голосов
/ 05 июля 2016

Я обычно использую ниже: 

$(content).attr("src")
where 
content = "img src='/somesource/image.jpg'>" //removed < before img for html rendering in this comment
0 голосов
/ 28 октября 2016

Я решил эту же проблему, пытаясь извлечь URL-адрес src из iframe. Вот простая функция JavaScript, которая будет работать для любой строки: 

function getSourceUrl(iframe) {
  var startFromSrc = iframe.slice(iframe.search('src'));
  return startFromSrc.slice(5, startFromSrc.search(' ') - 1);
}
Добро пожаловать на сайт PullRequest, где вы можете задавать вопросы и получать ответы от других членов сообщества.

Нет похожих вопросов

...