I have a list of items with each having a like button and number of likes. I need to order then based off the number of likes. Any ideas how to accomplish this?
<div>
<h1>Ranking</h1>
<!-- The list -->
<ul>
<li>
<h4>Item 1</h4>
<p>200 likes</p>
<p>♥ like?</p>
</li>
<li>
<h4>Item 2</h4>
<p>100 likes</p>
<p>♥ like?</p>
</li>
<li>
<h4>Item 3</h4>
<p>50 likes</p>
<p>♥ like?</p>
</li>
<li>
<h4>Item 4</h4>
<p>25 likes</p>
<p>♥ like?</p>
</li>
<li>
<h4>Item 5</h4>
<p>1 likes</p>
<p>♥ like?</p>
</li>
</ul>
</div>
You can try this code:
function sortAlpha(a,b){
// here we take the number of likes
var aLikes = parseFloat($(a).children("p").first().html());
var bLikes = parseFloat($(b).children("p").first().html());
return aLikes > bLikes? 1 : -1;
};
$('div ul li').sort(sortAlpha).appendTo('ul');
Related
I am trying to choose an element("Classic") from a dynamic dropdown list. Problem is that word Classic contains 2 elements.
Html page is:
<ul id="dynamic-14" class="results" role="list">
<li class="results-dept result">
<div dynamic-102" class="results" role="option">
<span class="match"/>
</div>
</li>
<li class="results-dept result">
<div dynamic-12" class="results" role="option">
<span class="match"/>
Classic
</div>
</li>
<li class="results-dept result">
<div dynamic-1022" class="results" role="option">
<span class="match"/>
Classic numbers
</div>
</li>
I tried to do it with xpath using:
//ul[#class="results"] //div[contains(.,'Classic')]
but it gives me back 2 values so robot framework can't choose one I need.
user normalize-space() function to get rid of the leading and trailing whitespace.
//ul[#class="results"] //div[ normalize-space(.)='Classic']
This is my menu template - using the DDRMenu template style
<ul class="nav" id="side-menu">
[*>NODE]
</ul>
[>NODE]
<li class="[?SELECTED]active[/?]">
[?NODE]
[=TEXT]
[?ELSE]
</span>
[/?]
[?NODE]
<ul class="nav nav-****second****-level">
[*>NODE]
</ul>
[/?]
[/>]
How do I replace the ****second**** with the correct ordinal depending on how many levels down the menu goes
I'm using below logic to show multi level menu in one project.
<ul>
[*>NODE]
</ul>
[>NODE]
<li id="languages-box-holder">
[?ENABLED]
[=TEXT]
[?ELSE]
<span>[=TEXT]</span>
[/?]
[?NODE]
<ul class="languages-box popup-box cream-bg">
<li class="arrow-top"><span class="shadow cream-bg"></span></li>
<li class="focusor-top"></li>
[*>NODE]
</ul>
[/?]
</li>
[/>]
It is possible to display on screen 'ul' list like this?:
<ul>
<li> a </li> <li> f </li> <li> k </li>
<li> b </li> <li> g </li> <li> k </li>
<li> c </li> <li> h </li> <li> l </li>
<li> d </li> <li> i </li> <li> m </li>
<li> e </li> <li> j </li> <li> n </li></ul>
I need to be everything in one ul and li in blocks (for example 5 elements).
You can do this with column-count CSS3
Try
ul {
-webkit-column-count: 3;
-moz-column-count: 3;
column-count: 3; /*3 in those rules is just placeholder -- can be anything*/
}
SEE DEMO
ul {width: 120px;}
li {margin: 0; padding:0; float: left; width: 40px;}
try looking into display: table-cell. I'm almost certain its what you want.
CSS-Tricks Display Property
You use CSS3 multi-column layouts. Apply following style to the UL:
UL {
column-count:3;
-moz-column-count:3;
-webkit-column-count:3;
}
(you may need to rearrange your LI as needed)
Demo: http://jsfiddle.net/2N7rB/
I want find the numberof lis items (li) in html below:
<div class="li-control-block">
<div class="inner">
<a class="scroll-left" href="?slideId=7">
<img width="59" height="30" alt="btn-hero-promo-slider-left" src="/c/images/btn-hero-promo-slider-left.png">
</a>
<ul class="slides-8">
<li class="first">
1
</li>
<li class="">
2
</li>
<li class="">
3
</li>
<li class="">
4
</li>
<li class="">
5
</li>
<li class="">
6
</li>
<li class="">
7
</li>
<li class="last on">
</ul>
<a class="scroll-right" href="?slideId=1">
</div>
</div>
I have tried code below but that comes back with "12345678" which gives me size of 1.
So how can I get the size to be equal to 8 ?
List<WebElement> list=null;
list = driver.findElements(By.cssSelector(".slides-8"));
int length = list.size();
Try doing
WebElement temp = driver.findElement(By.classname("slides-8"));
List<WebElement> list = temp.findElement(By.xpath(".//li"));
System.out.println(list.size());
Your example works as expected; your code requests the number of elements which have a class of "slides-8", which is the list container. Then you ask for how many elements that is, and it's one -- just one container.
Either apply a CSS class to each list element, or ask the container for the count of its elements.
you can try using cssSelectors as well,
List<WebElement> list = driver.findElements(By.cssSelector(".slides-8 > li"));
int length = list.size();
Hi I'm trying to get date from this content:
<div class="article-meta">
<h1>Kelkraščiu ir prieš eismą</h1>
<div class="clear"></div>
<ul>
<li>
<strong>Publikuota:</strong>
2012 spalio 8d.
</li>
<li>
<strong>Autorius:</strong>
Vardas, Pavardė
</li>
<li>
<strong>Rubrika:</strong>
Fotopolicija
</li>
</ul>
<div class="clear"></div>
</div>
I need to get this 2012 spalio 8d. put into variable.
I was trying with preg_match but don't now how to complete pattern.
Can someone help me?
Try this:
preg_match_all('/Publikuota:<\/[^>]+>\s*(\d+\s*\w+\s*\w+)/i', $html, $out);
print_r($out[1]);