If I have HTML like this:
<div id="target">
<div id="a1">
<div class="1">
</div>
<div id="a2">
<div class="2">
<div class="3">
<div class="4">
</div>
<div id="b1">
<div class="1">
</div>
<div id="b2">
<div class="2">
<div class="3">
<div class="4">
</div>
...
...
</div>
...is it possible to select only the first level of div elements from target. So, if I run page.css('#target div').each then I get every single div inside target. If I just want the results to contain the divs with ids ['a1','a2','b1','b2'] is that possible with Nokogiri?
Yes, this is called a child selector
#target > div
Without the > you have a descendant selector, which doesn't care if it's a child, grandchild, great grandchild etc.
Related
I have a xml like this and am trying to select the groupIdentifier element without the display:none child (would like to use the css "identifier" along with it) to finally select the input. Have been at this for hours and would like to call the xpath gods to help me out.
<div class="groupIdentifier">
<div>
<input class="inputClassIdentifier">
</div>
<div>
...
<div>
<div class="something">
... some more elements
</div>
<div class="identifier hidden" style="display: none">
... some more elements
</div>
<div class="something">
... some more elements
</div>
</div>
</div>
</div>
<div class="groupIdentifier">
<div>
<input class="inputClassIdentifier">
</div>
<div>
<div>
<div class="something">
... some more elements
</div>
<div class="identifier ">
... some more elements
</div>
</div>
</div>
</div>
Thanks
edit:
I have
//div[contains(#class, 'identifier') and not(contains(#style, 'display: none'))] which basically selects the identifier div of the second section.
What I need now is to select the input with class inputClassIdentifier within its parent.
Here's your xpath.
//div[#class='groupIdentifier' and div/div/div[not(contains(#style, 'display: none'))]]
I got it using descendant axis
//div[#data-testid='groupIdentifier' and descendant::div[contains(#class, 'identifier') and not(contains(#style, 'display: none'))]]//input[#name='inputClassIdentifier']
The question is simple but I don't have enough practice for this case :)
How to get price text value from every div within "block" if we know that we need only item_promo elements.
<div class="block">
<div class="item_promo">item</div>
<div class="item_price">123</div>
</div>
<div class="block">
<div class="item_promo">item</div>
<div class="item_price">456</div>
</div>
<div class="block">
<div class="item_promo">item</div>
<div class="item_price">789</div>
</div>
<div class="block">
<div class="item">item</div>
<div class="item_price">222</div>
</div>
<div class="block">
<div class="item">item</div>
<div class="item_price">333</div>
</div>
You could use the xpath :
//div[#class='block']/*[#class='item_promo']/following-sibling::div[#class='item_price']/text()
You look for div elements that has attribute class with value item_promo and look at its following sibling which has an attribute item_price and grab the text.
This XPath,
//div[div/#class='item_promo']/div[#class='item_price']
will return those item_price class div elements with sibling item_promo class div elements:
<div class="item_price">123</div>
<div class="item_price">456</div>
<div class="item_price">789</div>
This will work regardless of label/price order.
I have an arraylist from which I need to get values where isActive = true, and to display the data in a <div> tag with the use of ng-repeat.
My problem is that I don't want to keep using ng-repeat every time, while fetching values in each <div> tag.
Is there any generic solution which will iterate only once, and I can see the value in <div>, side by side. Please see this attempt:
enter link description here
I want to see a result like this:
You can write your ng-repeat like below.
Whenever it get isActive true, it will create the div section for this.
<body ng-controller="MainCtrl">
<div ng-repeat="tempData in data">
<div ng-if="tempData.isActive == true" >
<div class="col-xs-12" >
<div class="col-xs-4">Plan Type:</div>
<div class="col-xs-8">{{tempData.plantype}}</div>
</div>
<div class="col-xs-12">
<div class="col-xs-4">Term:</div>
<div class="col-xs-8">{{tempData.term}}</div>
</div>
<div class="col-xs-12">
<div class="col-xs-4">Rate:</div>
<div class="col-xs-8">{{tempData.rate}}</div>
</div>
</div>
</div>
</body>
I have this code
<div class="kakaa">
<div class="hihi">
<div>dfsfsdf</div>
<div class="haha">
<div id="kaka">ohfoehwf</div>
</div>
</div>
<div class="main">
<div>lorem</div>
</div>
</div>
Now, i want to remove div has class hihi, how to do it become
<div class="kakaa">
<div class="main">
<div>lorem</div>
</div>
</div>
You didn't specify if you're doing this on server-side or client-side. If client-side, no regex is necessary. Use jQuery:
$('.hihi').remove();
Here's a reference: http://api.jquery.com/remove/
If you're doing it server-side, don't use regex (you'll never be able to cover all the possibilities in an HTML tag with regex). Instead use a HTML DOM parser. Here's a very simple one: http://simplehtmldom.sourceforge.net/
I am trying to get all children which has specific class and parent of this parent does not have a specific class.
I am trying a code like this, but it's not working.
$hrefs = $xpath->evaluate("//div[not contains(#class, 'tested-app-section')]/div[#class='product-container-body']/div");
Structure of the HTML I am working with and need to edit a little bit looks like this, other HTML content in <body> is irrelevant. (<body> contains more then just this block of HTML):
<body>
<div class="product-detail-section tested-app-section">
<div class="product-container-head"> ... </div>
<div class="product-container-body"> ... </div>
<div class="product-container-body"> ... </div>
</div>
<div class="product-detail-section publish-app-section">
<div class="product-container-head"> ... </div>
<div class="product-container-body"> ... </div>
<div class="product-container-body"> ... </div>
</div>
<div class="product-detail-section product-specific-section">
<div class="product-container-head"> ... </div>
<div class="product-container-body"> ... </div>
<div class="product-container-body"> ... </div>
</div>
I am trying to avoid in the result the very first <div> box (box with class "tested-app-section"), then I am trying to avoid everything witch class "product-container-head".
But I just cannot find a way how to do it.
Edit: So basically I am trying to get
/html/body/div[contains(#class, 'product-detail-section') AND not contains(#class, 'tested-app-section')]/div[not(#class='product-container-head')]
but this code doesn't return anything...
You are close, but missed a few things. Try this xpath expression and see if it works:
//div[not(contains(#class, 'tested-app-section'))]/div[not(#class='product-container-head')]