I need extract value of attribute src from this HTML.
For example from this HTML:
<div class="css_telo js_telo">
<div class="css_teloV">
<div class="css_vlavo">
<div class="css_info css_zena">
<a class="css_foto big_foto" href="" title="Fotka: endoskopia"><span><img id="PPAsrc" src="http://m3.aimg.sk/profil/v_08c261dabb82e3eaded3e54c28c49e35.jpg?13922246241392224624" width="176" height="220" alt="Fotka: endoskopia" /></span></a>Zmeniť fotku
</div>
<div class="por_0">
<div class="css_album css_menubox edit c_prazdne" id="m_fotoalbumy">
<h3>Fotoalbumy<small> (0)</small></h3>
</div>
</div>
<div class="por_1">
<div class="css_album c_video xcss_akt css_menubox edit" id="m_videoalbumy">
<h3>Videoalbumy<small> (0)</small></h3>
</div>
</div>
<div class="por_2">
<div class="css_priatelia css_menubox edit" id="m_userFriends">
<h3>Priatelia<small> (0)</small></h3>
</div>
</div>
</div>
I need get this:
http://m3.aimg.sk/profil/v_08c261dabb82e3eaded3e54c28c49e35.jpg?13922246241392224624
I tried this XPATH expression:
//div[#class="css_telo js_telo"]/div[#class="css_teloV"]/div[#class="css_vlavo"]/div[#class="css_info css_zena"]/a/span/img/#src
But it not work. Where is problem?
it seem like its the only src on the page, you can simply do:
//img/#src
or more specific:
//img[#id="PPAsrc"]/#src
Related
I've to filter the div elements obtained from a database based on user input. This is a list of users of a chat and I want to show only the div of the user written in the input.
I've tried several solutions on the site but they don't work in React. I'm getting mad. Ideas?
Thanks so much in advance.
<div class="sidebar__chat--container">
<a class="link" href="/room/A">
<div class="sidebar__chat">
<div class="avatar__container">
<img src="1" class="MuiAvatar-img">
</div>
</div><div class="sidebar__chat--info">
<h2>Mario</h2>
</div>
</div>
</a>
<a class="link" href="/room/B">
<div class="sidebar__chat">
<div class="avatar__container">
<img "2" class="MuiAvatar-img"></div>
</div>
<div class="sidebar__chat--info">
<h2>John</h2>
</div>
</div>
</a>
</div>
<div className="sidebar__search">
<form className="sidebar__search--container">
<input
placeholder="Search for users"
type="text"
id="search"
/>
</form>
</div>
I provided an example in this SandBox
Note: I created a custom usersList that will be replaced by the data fetched from database
I am trying to find the parent of the span element with label First Name and go up the DOM until i get to the input element with class "mat-input-element"
I have attempted with the following xpath, but did not get the result i needed:
//div/div/span[contains(.,'First Name')]/parent::div[#class='add-users']/lib-text-input-v3/div/mat-form-field/div/div/div[1]/input
Any help would be appreciated. Thanks!
You can try with the below xpath.
//span[normalize-space(.)='First Name']/ancestor::div[#class='input-v3']//input[#class='mat-input-element']
Sample HTML: From jsfiddle
<html><head></head><body>
<div class="add-users">
<lib-text-input-v3 errortext="”Error" a="" valid="" first="" name”="">
<div class="input-v3">
<mat-form-field class="mat-form-field">
<div class="mat-form-field-wrapper">
<div class="mat-form-field-flex">
<div class="mat-form-field-infix">
<input class="mat-input-element" type="text">
<span class="mat-form-field-label-wrapper">
</span>
</div>
</div>
<div class="mat-form-field-underline>
<span class=" mat-form-field-ripple"="">
</div>
<div class="mat-form-field-subscript-wrapper">
<div class="mat-form-field-hint-wrapper">
<div class="mat-form-field-hint-spacer">
</div>
</div>
</div>
</div>. //closes mat-form-field-wrapper class
</mat-form-field>
<div class="input-v3__label"> // same level as input-v3 class
<div class="input-v3__label--text">
<span class="ng-tns-c11-01">First Name
</span>
</div>
</div>
</div> // closes input-v3 class
</lib-text-input-v3>
<lib-text-input-v3>…..
</lib-text-input-v3></div></body></html>
I am posting the code. In the line <div class='qrcode-value'></div> it will scan the qr code and I want to make it as link so that it will redirect to the other website once clicking on it. Instead of copy and paste.
<div id="content-overlay" style='display: none'>
<div class='qrcode-value'>
</div>
</div>
<a href="http://google.com">
<div class='qrcode-value'>
anything
</div>
</a>
fiddle https://jsfiddle.net/athulmathew/r73pn4w8/2/
You can use JavaScript to do this.
<div id="content-overlay" style='display: none'>
<div class='qrcode-value' onclick="location.href = 'https://stackoverflow.com/questions/56946816/link-to-same-page-using-div-class';">
</div>
</div>
Read more about onclick event here.
The image path is defined in item.imagePath.
<div *ngFor="let item of itemList">
<div style="background-image: url(item.imagePath)" class="thumb">
<span>{{item.productName}}</span>
</div>
<div>
<p>{{item.productFeature}}</p>
</div>
</div>
style="background-image: url(item.imagePath)"
What is the correct syntax as this does not work?
The styles are updated according to the value of the expression evaluation:
keys are style names with an optional . suffix (ie 'top.px', 'font-style.em'),
values are the values assigned to those properties (expressed in the given unit).
<div [ngStyle]="{'background-image': 'url(' + photo + ')'}"></div>
Try this
<div *ngFor="let item of itemList">
<div class="thumb">
<img src="{{item.imagePath}}" />
<span>{{item.productName}}</span>
</div>
<div>
<p>{{item.productFeature}}</p>
</div>
</div>
I have dropdown with list of people results.
Each result contain some details.
The demand is that click in each <div class="list-item clearfix">will redirect the user to specific change ' unless the user click on some inner span ( <span class="locationJob">) which redirect him to another page.
<div class="list">
<g:each in="${peopleList?.getResults()}" var="doc">
<div class="list-item clearfix">
<g:link controller="connection" action="details" id="${ApplicationUtils.encodeString(doc.ref?.toString())}">
<div class="avatar">
<span class=""><img src="${doc.avatarUrl}" width="41" alt="Avatar" class="img-circle"/></span>
</div>
<div class="info">some text</div>
<div class="row no-margin body highlight-search-term">
<span class="locationJob">
<g:link controller="profile" action="show" id="${ApplicationUtils.encodeString(profExperienceCompanyIds[index]?.trim())}" class="professional-exp-highlight">
{currentCompany}</g:link>
</div>
</g:link>
</span>
</div>
</g:each>
</div>
I understood that it's not correct to write inside .... So what should I do?
You can replace inside g:link, use input type with onclick method to run remoteFunction:
http://grails.github.io/grails-doc/2.2.1/ref/Tags/remoteFunction.html