ruby - 使用 DOM 检查器查找按钮的 ID

Question

我正在尝试使用 DOM 检查器查找 this page 底部“更多”按钮的 ID这揭示了更多的结果。

我正在尝试做类似这个例子的事情:

require 'watir-webdriver'

b = Watir::Browser.new
b.goto 'svpply.com/editors_pick'

#count products
puts b.elements(:xpath => '//li[@data-class="Product"]').count
#=> 30

#Now click button
show_all = b.button(:id => "btn_all")
show_all.click
sleep 4

#count products again
puts b.elements(:xpath => '//li[@data-class="Product"]').count
#=>60

但是，我不清楚如何在 DOM 结构中搜索该特定 ID。有人还可以解释属性、元素、id 和节点之间的区别吗？

Answer 1

为“更多”按钮使用 DOM 检查器:

1. 打开 DOM 检查器 (Ctrl+Shift+I)
2. 单击要检查的 [更多] 按钮
3. 在 DOM 检查器栏的右侧，单击 [HTML] 按钮
4. 这应该显示页面的 HTML，其中将包含 [More] 控件的详细信息。您会注意到该元素实际上是 DIV 而不是按钮。此外，ID 的格式为“_more”。

--> 这应该显示页面的 HTML，它将显示 [More] 控件的详细信息。您会注意到该元素实际上是 DIV 而不是按钮。此外，ID 的格式为“_more”。

所以要用 Quora 页面来做你的例子，你会做这样的事情:

require 'watir-webdriver'

class QuoraPage
    def initialize(browser)
        @browser = browser
    end

    def goto()
        @browser.goto 'http://www.quora.com/Startups/best_questions'
        wait_questions_loaded
    end

    def click_more()
        @browser.div(:id, /_more/).click
        wait_questions_loaded
    end

    def questions_count()
        @browser.links(:class, 'question_link').count{ |x| x.visible? }
    end

    def wait_questions_loaded()
        begin
            questions_start_count = questions_count()
            sleep(2)
        end while questions_start_count != questions_count()
    end 
end

page = QuoraPage.new(Watir::Browser.new :chrome)
page.goto
puts page.questions_count
page.click_more
puts page.questions_count

请注意，我必须将 sleeps 放入，否则 webdriver 会像提到的 anonygoose 一样挂起。我尝试了不同的 wait_untils，但没能找到有效的方法( sleep 不是很稳定)。

关于你关于节点、元素等的问题，我觉得你最好看看http://www.w3schools.com/dom/default.asp .