I have an element (for example, a body) nested somewhere inside a div.. Something like:
<div class=wrapper>
..
..
<body>
</body>
</div>
How would I go about selecting the body with jQuery?
As others have said - this doesn't look like valid HTML - I'm going to assume that you just gave that as an example as this technique can be used to find any type of element.
This should do the trick to locate the body tag -
$('div.wrapper').find('body')
When you don't specify in your selector that you are talking about a class . or id # attribute - the whole string will be matched to the type of element.
The same could be done for -
<img> tags -
$('div.wrapper').find('img')
<a> tags -
$('div.wrapper').find('a')
<span> tags -
$('div.wrapper').find('span')
etc...
Your HTML Markup is off, first of all.
<body>
<div class="wrapper">
<div class="body">
..
..
</div>
</div>
</body>
Select it with $('div.wrapper div.body')
Thanks to ClarkeyBoy for pointing out my mistakes, fixed my post.
It doesn't look like valid HTML, but try this:
$('div.wrapper body')
Surely that HTML isn't correct to have a body tag within a div? Unless it's inside an iframe?
However you could use this to select the body tag...
jQuery("div.wrapper body").whatever();
Related
So my problem is that i need to edit this image source in selenium, but it doesn't have id or class.
<div id="mbr-content">
<div class="nope" some random stuff>
<script>
</script>
<div class="mbr-image-container">
<div class="mbr-image-wrapper">
<div class="mbr-image">
<img src="this source need to modify" alt="app_image">
</div>
</div>
</div>
#Html continues here
I just in some reason cant figure this one out.
I know that I need to use this command but not sure what shut I putt inside as script.
driver.execute_script("something here")
Using python-3.7
The javascript required to set the src attribute of your <img> element is:
document.querySelector(".mbr-image > img").src="whatver you want";
So, you can try below solution:
js = 'document.querySelector(".mbr-image > img").src="whatver you want";'
driver.execute_script(js)
As per the HTML you have shared to edit the src attribute of the desired element you can use the following solution:
element = driver.find_element_by_xpath("//div[#class='mbr-image-container']/div[#class='mbr-image-wrapper']/div[#class='mbr-image']/img[#alt='app_image']")
driver.execute_script("arguments[0].setAttribute('src','something here')", element)
I want to get an HTML element with a jQuery selector and print out all its contents (either in an alert or console debug). Something like this...
<div class="mydiv">Hello is it me you are looking for?</div>
<script>
alert("But I still haven't found what I am looking for " + $("#mydiv").html());
</script>
I also tried printElement as suggested in this post, but that doesn't seem to work either.
Here is a simple fiddle.
The # is the id selector. You have a class (<div class="mydiv">) so you need to use the class selector .:
alert("But I still haven't found what I am looking for " + $(".mydiv").html());
Wrap the content for which you want to print HTML element.
<div id="myHtml">
<div class="mydiv">Hello is it me you are looking for?</div>
</div>
<script>
alert($("#myHtml").html())
</script>
I need to get the object of second level html element in my page.
<html>
<div id="out">
jasoidjisa
<html>
<head>//This object
<div id="in">
hihisdhi
</div>
</head>
</html>
</div>
<script>
alert(document.getElementsByTagName('html'));
</script>
Help me to access this html element via js
HTML is a reserved tag name and so you can't use it in the manner in which you have used it here. Which particular value from above are you trying to get exactly ? It might make sense to use the <div> tag with a class or I'd to identify it instead. If you specify which value you are specifically looking to get I can write up a theoretical solution.
vsank7787 was totally correct. Maybe you could use iFrames instead of nested html inside a HTML document since html is a reserved keyword.
I have this HTML:
<div class="region-list" id="region_North_America">
<strong>North America</strong>
</div>
and want to add more divs after the strong element to result:
<div class="region-list" id="region_North_America">
<strong>North America</strong>
<div> ... </div>
<div> ... </div>
<div> ... </div>
</div>
I am trying this:
var row_str = '<div>content here</div>';
$('#region_North_America div:last').html(row_str);
However, there is no change to the html. This is probably so since there is no div within the element selected.
I know that the js is making it to this code because I can print the content of row_str to the console.
So, how can I get to the end of that container element to add the new items?
Thx.
Try:
$("#region_North_America").append(row_str);
using append().
Or:
$("<div>content here</div>").appendTo("#region_North_America");
To create the element on the fly, and place it in the document.
Using the appendTo method.
Your code will just place html in the last div within #region_North_America. Use the append function.
$("div.region-list").append(row_str);
I'm struggling a bit with this : let's say I have a class in the body <body class="video page"> and in my page I have a pagination which add a number like this <body class="video-2 page"> at each page. I would like to target the class video whether or not it has a number in order to apply some jquery if the condition is filled.
How do I do that?
You can use this attribute selector to select elements that have a class attribute starting with video-:
[class^="video-"]
But for this to work, you’d have to make sure that the video- class is the first one in the element’s class attribute (see http://jsfiddle.net/Czyep/).
It might be better to have the video class and the pagination class be separate, e.g.:
<body class="video page-2 page">
I would split the classes like class="video two page" so that you can still address both classes separately. Nevertheless you can do something like
$('body[class*=video]')
$("body").not(".video");
Should select all bodies wich end with a number. You could also do:
if($("body").is("[class$='video-'")) {}
have you tried something like this this?
$('.video,.video-'+pageNumber).dosomething()
You can use the attribute starts with selector:
$("body[class^='video']");
Assuming I have understood your question correctly I would suggest that you use concatenation in your selector.
I assume that you are aware that you have specified two classes on your body tag namely video and page or video-2 and page. And I therefore assume that page is significant in your selection and should be included in your selector.
Therefore I would use this syntax whilst not as neat as some syntax it is very clear what is going on. Obviously you would need to incorporate this into what ever logic is driving your page selection.
var suffix = "";
$(".video" + suffix + ".page").dosomething(); // select <body class="video page">
suffix = "-2";
$(".video" + suffix + ".page").dosomething(); // select <body class="video-2 page">
Note that there should be no space between the classes in the selector because they have been declared in the same tag in the html.
Had you specified something like
<body class="video"> // body wrapper
<div class="page"> // page wrapper
</div>
</body>
Then a space would be required as you are then looking to match on div page within body with class video or video-2 as appropriate.
suffix = "-2";
$(".video" + suffix + " .page").dosomething(); // select <body class="video-2"><div class="page">