i am having the following html that contains 2 UL elements.
<ul>
1
2
3
<ul>
4
5
6
i am using the following logic to get the data from only first Ul element. but iam getting data from both ul elements. How can i fetch the data only from a first UL element?
uls = xyz_html.css('ul li')
uls.each do |li|
#ul_list_1 << li.text
end
#ul_list_1 displaying all the data as an array like [1, 2,3, 4,5,6] but i need output [1,2,3]
i tried the following logic also but i did not get the output
uls = xyz_html.css('ul:first-child li')
uls.each do |li|
#ul_list_1 << li.text
end
Can some one help me with this
You can use first-of-type CSS selector, which returns first occurence of given element, so:
xyz_html.css('ul:first-of-type li')
More info: https://css-tricks.com/almanac/selectors/f/first-of-type/
Related
On my html page, I want to make a list from a collection of entries in my model. However, some of those entries may be null, and in that case I want to have an empty list item, like so:
Something
Something else
More stuff
I do that by inserting a non-breaking space character. (regular whitespace won't generate empty list items) Here's a code snippet:
<ul>
#{
foreach (var x in Model.Entries)
{
var rayon = x.Rayon ?? " ";
<li>#rayon</li>
}
}
</ul>
Sadly, this does not work because it instead pastes verbatim.
And removing the quotation marks, and/or adding #: at the start, won't compile.
What can I do?
You can use Html.Raw.
use like this
<li> #(Html.Raw(rayon)) </li>
Instead of " " just give a blank string:
var rayon = x.Rayon ?? string.Empty;
In fact, I think you can even just scrap that variable assignment together and just use x.Rayon as-is - a null value should have the same effect
<ul>
#{
foreach (var x in Model.Entries)
{
<li>x.Rayon</li>
}
}
</ul>
Update:
Both above work for me. So, if still not working, it looks to be down to CSS/styles on your ul.
e.g.
OK, I think this is down to CSS/styles on the ul that you have then (both above work fine for me). e.g. the following CSS would hide empty li elements:
ul li:empty {
display: none;
}
So, check out your CSS.
If you don't want to change the existing style, you could add an extra class to your CSS and apply that for just this instance.
i.e.
CSS:
ul.show-empty-li li:empty{
display:list-item;
}
HTML:
<ul class="show-empty-li">
...
</ul>
Hi Ive used the following code and it works perfectly well. How can I make it click all the li items in a ul with an empty ie class="" >With an Xpath of
Xpath is ('//*[#id="Main_data"]/div[1]ul/li[1]/a/span')
html_list = driver.find_element_by_id("myId")
items = html_list.find_elements_by_tag_name("li")
for item in items:
text = item.text
print text
Ive tried item.click in the loop but obtained no results.
To locate elements having an empty class, use the "by XPath" locator:
items = driver.find_elements_by_xpath("//ul[#id = 'myId']//li[not(#class)]")
for item in items:
item.click()
I have so many arrays and want to use it
- list = ['index1', 'index2', 'index3'];
- list2 = ['list2', 'list21', 'list22'];
each item in list
div #{item}
each item2 in list2
span #{item2}
but it compiled this:
index1list2list21list22
index2list2list21list22
index3list2list21list22
I want this result:
index1list2
index2list21
index3list22
Are any solution for this? Can jade do this?
It seems like you want to iterate through list and get the element at the same index in list2.
What you probably want to do is something like the following:
- list = ['index1', 'index2', 'index3'];
- list2 = ['list2', 'list21', 'list22'];
each item, index in list
div #{item}
span #{item2[index]}
This will give you
index1list2
index2list21
index3list22
You'll want to ensure that list.length = list2.length and handle the case where they aren't (more specifically, when list.length > list2.length). Otherwise, you'll likely get something like the following:
- list = ['index1', 'index2', 'index3', 'index4'];
- list2 = ['list2', 'list21', 'list22'];
each item, index in list
div #{item}
span #{item2[index]}
Result:
index1list2
index2list21
index3list22
index4undefined
I'm looking to create an HTML structure with classes based on the values of arrays from Ruby.
I have 6 classes that will be applied to different elements on an 8x8 grid.
Each row will be a div with 8 span elements inside. In ruby, each nested array will be the div row and then each element will be a span assigned a class based on the value of the array element.
a = [[1,4,3,2,2,3,1,4]
[4,5,6,6,3,2,3,5]]
So two rows will be created with 8 elements inside with the appropriate classes.
Is it possible to convert data structures to HTML like this in Ruby?
Maybe this is what you want:
a = [[1,4,3,2,2,3,1,4],
[4,5,6,6,3,2,3,5]]
html = ''
a.each do |row|
html << "<div>%s</div>" % row.map { |c| %{<span class="#{c}"></span>} }.join
end
# puts html
update
In other words:
html = a.map do |row|
"<div>%s</div>" % row.map { |c| %{<span class="#{c}"></span>} }.join
end.join
umm.. yea. something among the lines of...
a.each do |subArray|
puts "<div>"
subArray.each do |element|
puts '<span class="#{element}">Some text</span>'
end
puts "</div>
end
If this doesn't fit your needs please post a more specific question.
I'm trying to figure out a way of finding the last node that matches a given xpath using last() function. The problem is that the last element of path also has a constraint specified.
"//div[#id='someId']/ul/li/div[#class='class1 class2 ']/span[#class='someType2 ']"
if I use
"//div[#id='someId']/ul/li/div[#class='class1 class2 ']/span[#class='someType2 ']' and last()]"
it still matches multiple nodes. Maybe one of the reasons is that the last div tag in the path contains 2 span elements. please help me select the last node which matches the above path.
Thanks and Regards,
Vamyip
If your xml is xhtml, why don't use CSS selectors ?
If I'm not mistaken, the selectors should be
#someId > ul > li > div.class1.class2 > span.someType2
#someId > ul > li > div.class1.class2 > span.someType2:last
I was using xpath on html pages too, but when CSS selectors became widespread I found that they are more supported across browsers than xpath.
Use:
(//div[#id='someId']/ul/li/div[#class='class1 class2 ']
/span[#class='someType2 '])
[last()]
Do note: the brackets surrounding the expression starting with //. This is a FAQ. [] binds stronger than // and this is why brackets are necessary to indicate different precedence.
In selenium, you can also use javascript to retrieve elements. How about something like this?
dom=var list1 =
document.getElementById('someId').
getElementsByTagName('li');
var finallist = new Array();
for (var i=0; i<list1.length; i++) {
var list2 = list1[i].getElementsByClassName("class1 class2");
for (var j=0; j<list2.length; j++) {
var list3 = list2[j].getElementsByClassName("someType2");
for (var k=0; k<list3.length; k++) {
finallist.push(list3[k];
}
}
}
finallist.pop()
http://seleniumhq.org/docs/04_selenese_commands.html#locating-by-dom