How to extract the <title> value - javascript

JS is not my main skill, hope someone can help. I am trying to make a GTM variable to extract . Problem is that I cant use class="rg-trailer-icon" as a class name because it changes based on the truck type that is viewed (trailer, truck, etc)
Thank you!

You can extract the title. You just have to scramble through.
t = document.querySelector('#scheduleContainer svg title').innerHTML
console.log(t)
<div id="scheduleContainer">
<div>
<div>
<svg>
<title>Hello</title>
<path>
</svg>
</div>
</div>
</div>

in javascript, using document.title should be enough

Related

Set Range Selection of All Text Between Two Elements

I have a javascript program that will copy a selection in a web page.
Is it possible to set that range selection through javascript?
Ex:
<html>
<h1>One</h1>
<h2>Two</h2>
<h3>Three</h3>
<h4>Four</h4>
</html>
I would like to set the range for everything between <h2> and <h4> so that I can copy the text to the clipboard.
I finally found the answer I was looking for...
It was at https://javascript.info/selection-range
Thanks guys for the -1... if you didn't know the answer or wanted clarification, you should have just said so.

Any way to get nearby html nodes different from current node's tag name in NodeJS?

Let's say I have the following html code..
<html>
<head></head>
<body>
<div>
<input type ="text">
<img src = "pic.jpg">
Home
</div>
</body>
</html>
And I want to look at the nodes around an element that's on the same level. For example, from the above html code, is it possible to do something like...
$("input").returnNodesOnSameLevel()
and it can return a list of nodes which here would contain [< input...>, < a...> ] ?
I'm using NodeJS's request module to grab the page source and then using Cheerio to do my parsing. The sibling() only returns nodes of the same tag name which makes sense. If there's a better module or another way to do this, please let me know.
Thank you.
If $("input").siblings() doesn't work, you could try: $("input").parent().children()

How to identify this element in protractor?

When I view some customer information, I see the customer information displayed at the bottom. I believe it comes from JSON call.
How to identify this element? I tried className but not working. Thanks for your help. And tried this css as well. .override-info hide-mobile ng-scope. I need to assert the name matches to John Grish:
<div class="override-info hide-mobile ng-scope" ng-if="overrideCustInfo">
<p class="override-info-title">You are viewing</p>
<p class="override-info-dtl ng-binding">John Grish</p>
<p class="override-info-dtl ng-binding">1177 Montogomery st</p>
<p class="override-info-dtl ng-binding">San Francisco, CA</p>
</div>
You can rely on class names:
expect(element
.all(by.css("div.override-info p.override-info-dtl"))
.first().getText()
).toEqual("John Grish");

Get the title of an <img> and apply it to it's parent <div> with YUI3

I have the following HTML:
<div>
<img src="source.com/image.jpg" title="My Image">
</div>
I would like to get the title of all images ("My image") in this case, and add this title on to the parent , so that the above example would look like this:
<div title="My Image">
<img src="source.com/image.jpg" title="My Image">
</div>
Would appreciate it very much if someone could give me a push in the right direction!
Thanks!
This is pretty much the same question as the previous one you posted. In this case you do need to save the image node to a variable so that you can read its title and set it to the parent.
YUI().use('node', function (Y) {
var image = Y.one('img');
image.get('parentNode').set('title', image.get('title'));
});
If you're having trouble making changes to DOM elements I'd suggest you take a little time to read a couple of articles/books that introduce you to the subject. Here are some good options:
Eloquent JavaScript. A great book for starting with JavaScript and that has a chapter about the DOM.
The Mozilla Developer Network has a great collection of articles.
The YUI3 Cookbook will give you everything you need to get started with YUI.

How to use Jquery to colour the background of an element, based on keywords within the html

I'm trying to use Jquery to firstly identify specific words within a span tag, and then colour the background of a div it is nested in. The HTML looks like this:
<div class="highlight item1 ll3">
<div class="Image">
<h2 class="Name">
<div class="type">
<span>Workshop</span>
</div>
<div class="Dates">
<p class="Desc">Toddlers are especially welcome to BALTIC on Tuesdays. Join
in the fun, as a BALTIC artist leads a practical session using a variety of
materials,...
</p>
So I think I need to use Jquery to identify if equals "Workshop" then color the div with class highlight (for e.g. set background to #000). I need to repeat this so that each div.highlight that has a different value is given a different color.
Thanks so much in advance.
Jason
Something like this should work:
$(document).ready(function(){
$("span:contains('Workshop')").parent().css({ "background-color" : "#f8f8f8" });
});
Check this example if you are looking to add css based on keywords
http://tinkerbin.com/q6GwDrvJ
<script type="text/javascript">
$(document).ready(function(){
$("span:contains(Workshop)").parent().css( "background-color","red" );
});
</script>

Categories

Resources