how to get text in a div without an id or class jsoup - html

i have the follow problem. I want to parse a html page with jsoup. The parsing is not the problem but i need to get the text in a div without using the id or class. there is a custom attribute in the div element.
<div id="test" custom="tester">Get this text </div>
i tried the follow thing:
Element bedrijfwrapper = document.select("custom[name="tester"].first();
but i dont't get it to work. Can someone help me out?

You should try this :
document.select('[custom="tester"]').first();
Good luck.

This might work:
doc.select("div[custom=tester]")

Related

How can I get the element of a-tag in the div class with selenium?

I recently work on the project that I have to get the element from a specific website.
I want to get the text elements that are something below.
<div class="block-content">
<div class="block-heading">
<a href="https://www~~~~~~">
<i class="fa fa-map">
::before
</i>
"Text I want to get"
</a>
</div>
</div>
I have been trying to solve this for a while, but I could not find anything working fine.
I would love you if you could help me.
Thank you.
According to the information you provided the text you are looking for is inside a element so the xpath for this element is something like:
//a[contains(#href,'https://www')]
But since there is also i element inside it, getting the text from a element will give you both text contained in a itself and the text inside the i.
So you should get the text from i that is looking like just a (space) here and reduce it from the text you are receiving from the a.
In case you want to perform this action on all the a elements containing href and i element inside it you can use the following xpath:
//a[#href and ./i]
If there are more specific definitions about the elements you are looking for - the xpath I mentioned should be updated accordingly
From your comment, I understood that you would like to extract that text. So here is the code for you which would extract the text you want.
Selenium::WebDriver::Wait
.new(timeout: 60)
.until { !driver.find_element(xpath: "//i[#class='fa fa-map-marker']/..").text.empty? }
p driver.find_element(xpath: "//i[#class='fa fa-map-marker']/..").text[/(?<=before \")\w+ \w+ \w+ \w+ \w+/]
output
"Text I want to get"
I couldn't get the elements that I wanted directly, so here's what I did.
It is just that I did modify the elements with some methods though.
def seller_name
shop_info_elements = #driver.find_elements(:class_name, "block-content")
shop_info_text= shop_info_elements.first.text
shop_info_text_array = shop_info_text.lines
seller_name = shop_info_text_array.first.chomp
seller_name
end
It is not beautiful, but it can work for any other pages on the same site.

Using AngularJS, How Can I Choose Not to Render a HTML Element if a Variable is Not Defined?

I'm trying to resolve an issue whereby a HTML element uses a Javascript variable to define the image it should display, but errors on load. Have a look at this line:
<img src="../../Images/{{variableData.data.canEdit}}.png" />
This currently works great, except under the browser's console, it is displaying an error to say that it cannot find the literal string "{{variableData.data.canEdit}}.png". I assume this is because AngularJS is loaded after the HTML elements are rendered by the browser.
How can I work around this?
I did try using the following Angular statement on the element like so:
ng-if="typeof(variableData.data)!=='undefined'"
But I imagine this makes no difference and the browser will still display a not found error message for the .png image.
The page all functions correctly, I just don't want those error messages in the browser's console.
Any ideas?
Many thanks
ng-if="variableData.data"
this should work fine
Change
src="<img src="../../Images/{{variableData.data.canEdit}}.png" />"
to
ng-src="<img src="../../Images/{{variableData.data.canEdit}}.png" />"
This makes sure it doesn't attempt to load until runtime of the javascript.
Changing the ng-if to just the variable (ng-if="variableData.data.canEdit") will make sure the element is loaded after the variable.
You have to put just variable like this
ng-if="variableData.data.canEdit"
Thanks to #PierreEmmanuelLallemant for answering this one in the comments.
The solution was to use ng-src within the img element, and then wrap the img element within a div and use an ng-if. Like so:
<div ng-if="variableData.data.canEdit"><img ng-src="../../Images/{{variableData.data.canEdit}}.png" /></div>
Using ng-src ensures that when Angular loads it sets the source attribute. Wrapping the img inside a div with ng-if makes sure that anything inside the div is not rendered until variableData.data.canEdit is defined.
Many thanks

Is there a way to add html attributes to an existing html element with Emmet?

I've been looking around and I can not find an answer to this.
Suppose I put the cursor right between the number 2 and the greater than sign in the following h2's opening tag.
<h2>Hello world!</h2>
And then I type .text-uppercase which gives me:
<h2.text-uppercase>Hello world!</h2>
After which I expand the abbriviation and I get
<h2 class="text-uppercase">Hello world!</h2>
Is there a way to achieve this by another method?
Maybe this works in your editor, in my personal VS Code installation, its not working, the action is Update Tag
your question is not that clear
i think you want this
var h2 = document.getElementsByTagName("h2");
h2.classList.add('text-uppercase');
now you can do it onClick or using some other trigger
happy coding!!!
hope it helps

Protractor: Finding Element by Div Text

Hey I have this code in one of my div elements:
<div class="col-sm-8">Account Information: </div>
Can someone tell me how I would go about finding this element in my protractor code? Is it possible to do something like this:
expect(element(by.divText('Account Information: ')).isDisplayed()).toBe(true);
I have multiple elements with the class "col-sm-8" so I am not able to find the element by class. I was just wondering if there is any way to possibly find the element using the text in the div element? Thanks for the help!
I would recommend you to use by.cssContainingText
element(by.cssContainingText('.col-sm-8', 'Account Information'))
There is no webdriver method which would allow locating an element by its text. You could try using xpath in the following way (not tested):
element(by.xpath('//div[contains(text(), "Account Information: ")]')
keep in mind by.cssContainingText matches the element by PARTIAL text
so element(by.cssContainingText('div', 'male')) will actually match both male and female text
To solve this, use xpath with exact text match
element(by.xpath('//div[text()="male"]'))

Unable to validate HTML5 when using placeholder in div

I've been contributing to a WYSIWYG text editor that was made using HTML5 and jQuery. While doing some of my research I've been seeing a lot of people use the placeholder attribute in a div. However, this does not follow the specification and I end up with the following error when I try to validate my HTML.
Attribute “placeholder” not allowed on element “div” at this point.
Is there a better way to do this so that my HTML will validate and I still end up with a placeholder?
Thanks to Juantxo Cruz's link I was able to fix my issue by using CSS as shown below:
HTML
<div contentEditable=true data-placeholder="Sample text"></div>
CSS
[contentEditable=true]:empty:not(:focus):before {
content:attr(data-placeholder)
}