This question already has answers here:
How can I check if selector exists in Puppeteer?
(8 answers)
Closed 7 months ago.
I am using the JavaScript Puppeteer API. I need to check if an element(a button) is available on a webpage so I am able to click it without the worry of it giving me an error. Sometimes the element won't appear, so knowing it's there will help me to know when to click it.
Thanks for any help!
The Page.$ function will allow you query the page for an element by its selector. If it is there it will return an "element handler" if it is not present on the page it will return null. Remember to await it since this like most puppeteer functions is async.
https://pptr.dev/api/puppeteer.page._
Example:
const element = await page.$('.my-selector');
if(element !== null){
//click on it
}
`
Related
This question already has answers here:
Why does jQuery or a DOM method such as getElementById not find the element?
(6 answers)
Closed 2 years ago.
I have the following piece of code in my javascript file(helper.js):
var a = $('li')
$(window).keydown(function(e) {
\\whatever
})
it is supposed to select all tags in my html file and store in in a, however when I use this code, it a is null(which it shouldn't be). when I change my code to:
$(window).keydown(function(e) {
var a = $('li')
\\whatever
})
a is initialized correctly. Does anyone knows why? I am using jquery 3.3.1.
If you are dealing with the DOM (Document Object Model), use $(document).
If you are dealing with how user interact with the window, screen and so on, use $(window)
Here is a link for better understanding window and document
Window vs Dom
This question already has answers here:
jQuery ID selector works only for the first element
(7 answers)
Closed 2 years ago.
I have the following code snippet
$("#personalizacoesOpcionais")
.find(".qtdPersonalizacao")
.each(function (n, t) {
var i = {};
i.IdProdutoIngrediente = parseInt($(t).attr("data-id"));
i.Qtde = parseFloat($(t).text());
r[n] = i
});
In the html there are several divs personalizacoesOpcionais and each one with numerous elements qtdPersonalizacao.
However, the code snippet above only returns the first item qtdPersonalizacao within the first personalizacoesOpcionais.
However, the code snippet above only returns the first item qtdPersonalizacao within the first personalizacoesOpcionais.
Ids are supposed to be unique within a document and jQuery will just returns the first matching element.
The recommended solution would be to use a class instead of an id for personalizacoesOpcionais.
If this is not possible, for example if you don't control the code that generate the markup, a workaround would be to use $("div[id=personalizacoesOpcionais]") instead of $("#personalizacoesOpcionais")
This question already has answers here:
Get the values from the "GET" parameters (JavaScript) [duplicate]
(63 answers)
Closed 3 years ago.
I'm having an issue with my codes concerning the transfer of information from one page to another using the url as shown below:
window.location.href ="form.html?uname="+uname;
The value is displaying in the url box but when I try to display it on the form.html page using the following code:
window.onload = function ()
{
var name = document.getElementById("uname");
alert(name);
}
The alert keep displaying null.
What is the issue because after an hour of troubleshooting, I can't seem to figure it out.
Is the null being displayed in the alert box means that the value is not being retrieve from the url?
Thanks in advance.
document.getElementById('uname')
looks for an HTML element with the corresponding id. What you probably want to do is:
alert(uname)
This question already has answers here:
What do querySelectorAll and getElementsBy* methods return?
(12 answers)
Closed 5 years ago.
I have looked around and I haven't really been able to find anything that solves my problem. There is a post using buttons but I can't seem to modify it for my needs.
I am trying to use only one event listener for multiple selects. I'd like to return the id of the select, and the value selected but as far as I can figure I either need to use document.getElementById("ID").addEventListener('change',func(),true) for each id or document.getElementsByTagName('select').addEventListener('change', func(), true) and I get an error that says:
selection.addEventListener is not a function. (In 'selection.addEventListener('change', func(), true)', 'selection.addEventListener' is undefined)
I was hoping someone could take a moment and show me where I am going wrong or if I need to use a different method to accomplish my task.
thanks for the help
The method getElementsByTagName returns HTMLCollection of elements, and not a DOM Element, so you can't use addEventListener on that.
What you can do is go over all the elements in the HTMLCollection and add the event you want to them:
let selectElements = document.getElementsByTagName('select');
Array.prototype.forEach.call(selectElements, function(el) {
eladdEventListener('change', func(), true)
})
This question already has answers here:
Closed 10 years ago.
Possible Duplicate:
javascript object max size limit at 10000 chars
I want to check whether html source contains a specified string, but I'm only getting 10,000 characters (in alert box)
var str=document.documentElement.innerHTML;
if(str.indexOf("abcxyz") !== -1)
{
alert(str);
}
How can I fix that?
If you need to display a huge string in alert boxes, I guess you could split it into 10,000-character chunks and display them in order. Alternatively, just use console.log to print it out.
And is there a better way to detect a "onClick" event?
Better than what? JavaScript events will bubble up to the top containing element (unless some element in the chain calls stopPropagation()), so an easy way to detect click events would be to attach a click handler to document.body:
document.body.onclick = function() { alert('Click!'); }