Как извлечь все атрибуты из IMG тег

Я пытался использовать Nokogiri повернуть:Как извлечь все атрибуты из IMG тег

<img class="img-responsive" src="img/logologo.png" alt="">

к:

<%= image_tag('img/logologo.png', :class => 'img-responsive', :alt => '') %>

Вот мой код:

# a = <img class="img-responsive" src="img/logologo.png" alt="" width="256" height="256"> 
page = Nokogiri::HTML(a) 
img = page.css('img')[0] 
src = "" 
alt = "" 
class_atr = "" 
src = img['src'] if img['src'].present? 
alt = img['alt'] if img['alt'].present? 
class_atr = img['class'] if img['class'].present? 
result = "<%= image_tag(\'" + src + '\', :class => \'' + class_atr + '\', :alt => \'' + alt + '\')%>'

Это вроде как жесткий код, есть ли способ извлечь все атрибуты и его src?

Тэг изображения может содержать height или width параметров. Как извлечь все атрибуты автоматически и сделать их в ERB?

источник

2017-01-01 Coda Chang

Почему вы хотите перевести статический 'img' HTML тег в' image_tag' с атрибутами жёстко? Чего вы пытаетесь достичь? – spickermann

Когда я разрабатывал страницу erb, мне нужно преобразовать '' из-за конвейера ресурсов rails. Мой сторонний партнер знает, как писать 'html' вместо' erb'. –

Используйте следующий код для перебора всех <img> теги внутри HTML-разметки и получить их атрибуты:

page = Nokogiri::HTML <<-html 
    <img class="img-responsive1" src="img/logologo.png" alt="" width="256" height="256"> 
    <a href="#">A tag</a> 
    <img class="img-responsive2" src="logologo222.png"> 
html 

page.css('img').each do |img_node| 
    img_attributes = img_node.attributes.values # list of image attributes 

    # e.g., to output key-value pairs: 
    img_attributes.each do |attr| 
     p [attr.name, attr.value] 
    end 
end

источник

2017-01-01 16:29:54 vlasiak

Спасибо, я понял. –

ОК, Есть много вещей, чтобы работать дальше. Начнем с того, как вы разбираете HTML. Если все, что вы делаете разборе фрагмент или один тег, вы можете использовать DocumentFragment сказать Nokogiri, чтобы не добавлять обычные HTML-теги:

require 'nokogiri' 
doc = Nokogiri::HTML('<img class="img-responsive" src="img/logologo.png" alt="">') 
doc.to_html # => "<!DOCTYPE html PUBLIC \"-//W3C//DTD HTML 4.0 Transitional//EN\" \"http://www.w3.org/TR/REC-html40/loose.dtd\">\n<html><body><img class=\"img-responsive\" src=\"img/logologo.png\" alt=\"\"></body></html>\n"

Вместо этого, вы можете сделать:

doc = Nokogiri::HTML::DocumentFragment.parse('<img class="img-responsive" src="img/logologo.png" alt="">') 
doc.to_html # => "<img class=\"img-responsive\" src=\"img/logologo.png\" alt=\"\">"

Следующая , не используйте css, xpath или search, если вы имеете в виду at, at_css или at_xpath. Размышлять об этом:

doc.css('img').class # => Nokogiri::XML::NodeSet 
doc.at('img').class # => Nokogiri::XML::Element 

doc.css('img')[0].to_html # => "<img class=\"img-responsive\" src=\"img/logologo.png\" alt=\"\">" 
doc.css('img').first.to_html # => "<img class=\"img-responsive\" src=\"img/logologo.png\" alt=\"\">" 
doc.at('img').to_html # => "<img class=\"img-responsive\" src=\"img/logologo.png\" alt=\"\">"

That css, xpath и search возвращает NodeSet значит и что вспомнить. at и его варианты эквивалентны использованию first или [0] на возвращаемом NodeSet, возвращая первый узел, поэтому используйте at и друзей, если это то, что вы имеете в виду, так как это приводит к тому, что код не такой шумный.

Вот как я бы об этом:

require 'nokogiri' 
doc = Nokogiri::HTML::DocumentFragment.parse('<img class="img-responsive" src="img/logologo.png" alt="">') 

img = doc.at('img') 
img_src = img.delete('src') 
img_params = img.map { |p, v| ":%s => '%s'" % [p, v] }.join(', ') 
# => ":class => 'img-responsive', :alt => ''" 

img_template = "<%%= image_tag('%s', %s) %%>" % [img_src, img_params] 
# => "<%= image_tag('img/logologo.png', :class => 'img-responsive', :alt => '') %>"

Конечно, используя формат :k => "v" для ключа/значения старой школы. Я бы рекомендовал изменения в:

img_params = img.map { |p, v| "%s: '%s'" % [p, v] }.join(', ') # => "class: 'img-responsive', alt: ''"

что приводит:

"<%= image_tag('img/logologo.png', class: 'img-responsive', alt: '') %>"

источник

2017-01-06 00:56:34

Как извлечь все атрибуты из IMG тег

ответ

Смежные вопросы