XHTML:
<span style="color:#696969;">
<span style="font-family:tahoma;">
<span style="font-size:8pt;">
18F, Mirae Asset CENTER1 West Tower
</span>
</span>
</span>
converted document.xml:
<w:r>
<w:rPr>
<w:rFonts w:ascii="Tahoma" w:hAnsi="Tahoma"/>
<w:b w:val="false"/>
<w:i w:val="false"/>
<w:color w:val="696969"/>
</w:rPr>
<w:t>
18F, Mirae Asset CENTER1 West Tower
</w:t>
</w:r>
font-size:8pt; not getting converted to <w:sz w:val="8"/> in ooxml.
If font-size is given as small,x-large,etc. it gets converted.
You'd expect it to get converted as w:val=16 since the measurement is in half points. https://github.com/plutext/docx4j/blob/master/docx4j-core/src/main/java/org/docx4j/model/properties/run/FontSize.java#L123
Related
Hi I have two exact element on the page I want to click first or second.When using 1 [0] two elements are marked
what I tryed is '//span[contains(text(), "CTA Button")]' but both elements are marked
also '//spancontains(text(), "CTA Button")' again both are marked
<div class="ng-untouched ng-pristine ng-valid ng-star-inserted">
<!---->
<!----><!---->
<mat-slide-toggle class="mat-slide-toggle mat-accent ng-untouched ng-pristine ng-valid ng-star-inserted" id="mat-slide-toggle-6"><label class="mat-slide-toggle-label"><div class="mat-slide-toggle-bar"><input class="mat-slide-toggle-input cdk-visually-hidden" type="checkbox" id="mat-slide-toggle-6-input" tabindex="0"><div class="mat-slide-toggle-thumb-container" style="touch-action: none; user-select: none; -webkit-user-drag: none; -webkit-tap-highlight-color: rgba(0, 0, 0, 0);"><div class="mat-slide-toggle-thumb"></div><div class="mat-slide-toggle-ripple mat-ripple" mat-ripple=""></div></div></div><span class="mat-slide-toggle-content">
CTA Button
</span></label></mat-slide-toggle>
<!---->
</div>
This is to query first element: (//span[contains(text(), "CTA Button")])[1]
This is to query second element: (//span[contains(text(), "CTA Button")])[2]
I have a question related to Selenium.
I want to get the text "DISSMISSED" from a webpage. however I tried the following codes and it doesn't work or cannot locate the element.
text7 = driver.find_element_by_xpath("//span/#class='icon-check']").text
or
text7 = driver.find_element_by_xpath("//div[strong[text()='Case Status']]").text
Here is the html code:
<p>
<strong>Case Status: </strong>
<span class="icon-check" aria-hidden="true"></span>
DISMISSED
<span> </span>
The text you want to get is in between the <p></p> tag, then
//span[#class='icon-check']/parent::p
with this simple xpath you can get the DISMISSED text.
If HTML is as below:
<HTML>
<Body>
<p>
<strong>Case Status: </strong>
<span class="icon-check" aria-hidden="true"></span>
DISMISSED
<span> </span>
</p>
</Body>
</HTML>
That means text DISMISSED belongs to p tag
So try that
//p/strong[contains(.,'Case Status')]/following-sibling::span/..
OR
//p[contains(.,'DISMISSED')]/strong[contains(.,'Case Status')]/following-sibling::span/..
I’ve create a very simple client banner: 1 row of 6 images and an orange background. I'm not sure what my best options are for removing the seemingly doubled amount of padding that is automatically created between each image. Here’s where you can view the current banner: http://dalaigroup.com/maryland-seo/
What I'm trying to keep in mind, is how the images redistribute for a mobile device. The excess padding and margin space is much more noticeable here. Creating zero or negative margin space doesn't work in my favor, because of how the images reformat for mobile.
I'm not sure if I should be creating containers around every 2 images, working in a responsive table, or writing separate code for a mobile version. Is it necessary to write separate code for a client banner like this? How can I write this so that I have more control over the margin and padding? When I try to set specific sizes for these elements, the logo sizes are easily compromised.
Any tips you have will really help. Thank you for your time.
Above each of your divs that is holding the image is an empty <p> tag. This is causing the extra space on top of each of your images. Removing those, as seen in my edit below, should equalize the spacing.
A few other recommendations on the images:
Be careful setting exact width on the images in bootstrap, it could cause spacing issues when viewed on a smaller screen.
Bootstrap has these two classes which you could add to the image that will keep them centered and scale their size proportionately according to user screen size: <img class="img-responsive center-block" src="foo" />
On the snippet below, vertical margin is missing because it isn't pulling the WordPress CSS from your stylesheet
Edit: Added the class with margin definitions from the URL you provided
.aligncenter {
margin-top: 25px;
margin-bottom: 25px;
}
<link href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css" rel="stylesheet"/>
<div class="row" style="background: #fe8101;">
<div class="col-md-2 col-xs-6"><img class="aligncenter size-full wp-image-16855" title="McCormick" src="http://dalaigroup.com/wp-content/uploads/2017/05/McCormick-Logo-Small-Square.png" alt="McCormick-Logo" srcset="http://dalaigroup.com/wp-content/uploads/2017/05/McCormick-Logo-Small-Square.png 250w, http://dalaigroup.com/wp-content/uploads/2017/05/McCormick-Logo-Small-Square-150x150.png 150w" sizes="(max-width: 250px) 100vw, 250px" height="250" width="250"></div>
<div class="col-md-2 col-xs-6"><img class="aligncenter size-full wp-image-16272" title="Adidas" src="http://dalaigroup.com/wp-content/uploads/2017/04/Adidas-Logo-Small-Square.jpg" alt="Adidas-Logo" srcset="http://dalaigroup.com/wp-content/uploads/2017/04/Adidas-Logo-Small-Square.jpg 250w, http://dalaigroup.com/wp-content/uploads/2017/04/Adidas-Logo-Small-Square-150x150.jpg 150w" sizes="(max-width: 250px) 100vw, 250px" height="250" width="250"></div>
<div class="col-md-2 col-xs-6"><img class="aligncenter size-full wp-image-16271" title="Abercrombie & Fitch" src="http://dalaigroup.com/wp-content/uploads/2017/04/Abercrombie-and-Fitch-Logo-Small-Square.jpg" alt="Abercrombie-and-Fitch-Logo" srcset="http://dalaigroup.com/wp-content/uploads/2017/04/Abercrombie-and-Fitch-Logo-Small-Square.jpg 250w, http://dalaigroup.com/wp-content/uploads/2017/04/Abercrombie-and-Fitch-Logo-Small-Square-150x150.jpg 150w" sizes="(max-width: 250px) 100vw, 250px" height="250" width="250"></div>
<div class="col-md-2 col-xs-6"><img class="aligncenter size-full wp-image-16274" title="Citibank" src="http://dalaigroup.com/wp-content/uploads/2017/04/Citibank-Logo-Small-Square.jpg" alt="Citibank-Logo" srcset="http://dalaigroup.com/wp-content/uploads/2017/04/Citibank-Logo-Small-Square.jpg 250w, http://dalaigroup.com/wp-content/uploads/2017/04/Citibank-Logo-Small-Square-150x150.jpg 150w" sizes="(max-width: 250px) 100vw, 250px" height="250" width="250"></div>
<div class="col-md-2 col-xs-6"><img class="aligncenter size-full wp-image-16288" title="Sheraton Hotels" src="http://dalaigroup.com/wp-content/uploads/2017/04/Sheraton-Logo-Small-Square.jpg" alt="Sheraton-Hotels-Logo" srcset="http://dalaigroup.com/wp-content/uploads/2017/04/Sheraton-Logo-Small-Square.jpg 250w, http://dalaigroup.com/wp-content/uploads/2017/04/Sheraton-Logo-Small-Square-150x150.jpg 150w" sizes="(max-width: 250px) 100vw, 250px" height="250" width="250"></div>
<div class="col-md-2 col-xs-6"><img class="aligncenter size-full wp-image-16278" title="Gap" src="http://dalaigroup.com/wp-content/uploads/2017/04/Gap-Logo-Small-Square.jpg" alt="Gap-Logo" srcset="http://dalaigroup.com/wp-content/uploads/2017/04/Gap-Logo-Small-Square.jpg 250w, http://dalaigroup.com/wp-content/uploads/2017/04/Gap-Logo-Small-Square-150x150.jpg 150w" sizes="(max-width: 250px) 100vw, 250px" height="250" width="250"></div>
</div>
My Xpage has a Bootstrap style search field. When the user types something in the search field I want the clear glypicon to appear, allowing the user to clear the search field and reset the view.
I found some code to do this but am unable to integrate it into my Xpages app. When I try to run this and enter text into the field, Chrome throws the error:
Uncaught TypeError: Cannot read property
'toLowerCase' of undefined
My code is below:
<?xml version="1.0" encoding="UTF-8"?>
<xp:view xmlns:xp="http://www.ibm.com/xsp/core">
<xp:this.resources>
<xp:styleSheet href="/cc_CommonSearchBar.css"></xp:styleSheet>
</xp:this.resources>
<xp:div style="width:300px" styleClass="btn-group">
<xp:div styleClass="input-group add-on">
<xp:inputText styleClass="input-medium search-query"
id="searchinput" type="text">
<xp:this.attrs>
<xp:attr name="placeholder" value="Search"></xp:attr>
</xp:this.attrs>
<xp:eventHandler event="onkeyup" submit="false">
<xp:this.script><![CDATA[var srcClr = XSP.getElementById("#{id:searchclear}");
srcClr.toggle(Boolean($(this).val()));
$(".searchclear").toggle(Boolean($(".searchinput").val()));
$(".searchclear").click(function(){
$(this).parent().find('.searchinput').val('').focus();
$(this).hide();
});]]></xp:this.script>
</xp:eventHandler></xp:inputText>
<xp:span id="searchclear"
styleClass="searchclear glyphicon glyphicon-remove-circle">
</xp:span>
<xp:div styleClass="input-group-btn">
<xp:button styleClass="btn btn-default" type="submit"
style="height:34px">
<i class="glyphicon glyphicon-search" />
</xp:button>
</xp:div>
</xp:div>
</xp:div>
</xp:view>
With Frank's answer below I was able to get this to almost work. My only problem now is a bootstrap issue; the reset x appears over the search button. But I almost have it:
<?xml version="1.0" encoding="UTF-8"?>
<xp:view xmlns:xp="http://www.ibm.com/xsp/core">
<xp:this.resources>
<xp:styleSheet href="/cc_CommonSearchBar.css" />
</xp:this.resources>
<div class="input-group" style="width:300px">
<!-- <div class="btn-group">-->
<input id="searchinput" type="text" class="form-control"
placeholder="Search for..." />
<span id="searchclear" class="glyphicon glyphicon-remove-circle" />
<span class="input-group-addon" id="basic-addon2">
<i class="glyphicon glyphicon-search" />
</span>
</div>
<xp:scriptBlock id="scriptBlock1">
<xp:this.value><![CDATA[$(document).ready(function(){
$("#searchinput").keyup(function(){
$("#searchclear").toggle(Boolean(this.value));
});
$("#searchclear").toggle(Boolean($("#searchinput").val()));
$("#searchclear").click(function(){
$("#searchinput").val("").focus();
$("#searchclear").hide();
});
});]]></xp:this.value>
</xp:scriptBlock>
</xp:view>
first you need to identify where exactly it is going wrong.
You are calling $(".searchinput").val(), but in your code there is no element with a class 'searchinput'.
Either add 'searchinput' class to the search box.
<xp:inputText styleClass="searchinput input-medium search-query"
id="searchinput" type="text">
</xp:inputText>
Trying to get currency values from some html using scrapy.Code is
links = hxs.select('//a[#class="product-image"]/div[#class="price-box"]//span[#class="price"]/text()').extract()')
And the HTML
<div>
<span>
<sub>
<li class="item first">
<a href="http://www.xtra-vision.ie/dvd-blu-ray/to-rent/new-release/dvd/pitch-perfect-dvd.html" title="Image for Pitch Perfect" class="product-image">
<span class="exclusive-star">
</span>
<img src="http://www.xtra-vision.ie/media/catalog/product/cache/3/small_image/124x173/5b02ab93946615b958c913185aae2414/i/w/iws_5167c10c906b57.33524324.JPG.jpg" alt="Image for Pitch Perfect" />
<h2 class="product-name">Pitch Perfect</h2>
<div class="price-box">
<span class="regular-price" id="product-price-5174">
<span class="price">
€15
<sub class="price-bit">.99</sub>
</span>
</span>
</div>
</a>
</li>
</sub>
</span>
</div>
The resulting price i get is \u20ac15\t\t\t\t\t\t
Is there some way I can extract 15.99 from this html using xpath
I used a combination of xpath and Python so might not be quite what you were after, although this was mainly employed to get rid of the extraneous tabs added to the end of the "price".
price = hxs.select('//span[#class="price"]/text()').extract()
pricebit = hxs.select('//span[#class="price"]/sub[#class="price-bit"]/text()').extract()
totalprice = price + price-bit
totalstr = ''.join(totalprice).replace('\t','')