Currently experiencing a Javascript issue where the length of an element is not displayed correctly when using .length, even though it shows up in Chrome console.
Here is what it looks like in Chrome console
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="content-type" content="text/html; charset=utf-8"/>
<title>Hello World - Google Web Search API Sample</title>
<script src="https://www.google.com/jsapi"
type="text/javascript"></script>
<script language="Javascript" type="text/javascript">
google.load('search', '1');
function OnLoad() {
var searchControl = new google.search.SearchControl();
var localSearch = new google.search.LocalSearch();
searchControl.addSearcher(new google.search.WebSearch());
localSearch.setCenterPoint("New York, NY");
searchControl.draw(document.getElementById("searchcontrol"));
searchControl.execute("a");
}
google.setOnLoadCallback(OnLoad);
</script>
</head>
<body onLoad="myFunction()">
<div id="searchcontrol">Loading</div>
<script>
function myFunction() {
var y = document.getElementsByClassName('gsc-webResult gsc-result');
var y2 = y.length;
console.log(y);
console.log(y2);
}
</script>
</body>
</html>
The problem lies in saving the element in variable y and getting its length in y2, leading to incorrect results when console logging them.
If you have any insights on this issue, your help would be much appreciated.
Edit: Included functional source code.