Trying to follow a guide, but struggling to identify the error in my JavaScript syntax

I'm attempting to follow an older tutorial to change all references of the word "cão" on a page to "gato". These instances are contained within spans, and I'm using the getElementsByTagName method in my script. However, when trying to cycle through each position with a for loop, I encounter a syntax error after the increment i++. Can anyone explain why this is happening?


var elementoHeading = document.getElementById('heading');
elementoHeading.innerHTML = "Tudo sobre gatos";

var nomesTags = document.getElementsByTagName("span");   

for (var i = 0; i < nomesTags.length; i++) {
    nomesTags[i].innerHTML = "gato";
}

Answer №1

To ensure proper syntax in the for loop, use semicolons instead of commas:

for (var i = 0; i < tagsNames.length; i++) {
              ^                     ^

The reason for the syntax error occurring after the increment is because the JavaScript engine expects three statements within the parentheses of the for loop, but only one was provided (commas do not end the statement).

Similar questions

If you have not found the answer to your question or you are interested in this topic, then look at other similar questions below or use the search

The issue with knockoutjs and isotope is that the new item being added causes the first element to move erratically

Currently utilizing knockoutjs along with the isotope masonry layout, incorporated with a custom binding referring to the code blog link provided here: Snippet from the View: <div id="container" class="isotope" data-bind="foreach: bills"> <d ...

combine two separate typescript declaration files into a single package

Can anyone help me figure out how to merge two typescript definition packages, @types/package-a and @types/package-b, into one definition package? package-a.d.ts [export package-a {...}] package-b.d.ts [exports package-b {...}] package-mine.d.ts [ export ...

Adding an item to an object array in MongoDB can be achieved with the use of either the addToSet or push operators

I have a set of reviews in an array, and I am trying to implement addToSet functionality to add a review while ensuring that a user can only review once. Below is how my schema is structured: const sellerSchema = new mongoose.Schema({ user: { type: ...

Deactivate the ability to print charts exclusively on HighCharts

I am currently working with a DotNetHighchart that has features like Print Chart, Download as PDF, etc. My goal is to remove only the print chart option. In earlier versions of Highcharts, this was easily achieved by using: .SetExporting(new Exporting { ...

How can I identify when a browser window is maximized using JavaScript or CSS?

I am currently working on a dashboard designed for static display on large monitors or TVs for clients. My main goal is to implement CSS styling, specifically a snap-scroll feature, but only when the display is in 'fullscreen' or 'maximized& ...

Using jQuery to target a specific HTML element by its ID, not requesting the entire webpage

Currently, I am attempting to utilize jQuery ajax to fetch a project page. In this scenario, the xhr variable is expected to hold the correct string to the webpage (the target page). I have set up a condition to prevent the page from loading as a mobile v ...

ESLint warning: Potentially risky assignment of an undetermined data type and hazardous invocation of an undetermined data type value

Review this test code: import { isHtmlLinkDescriptor } from '@remix-run/react/links' import invariant from 'tiny-invariant' import { links } from '~/root' it('should return a rel=stylesheet', () => { const resp ...

Comparing background-color using .css() in jQuery/Js

I've been experimenting with creating angled divs on a webpage, where each basic panel is separated by an angled break. The idea is to have the background-image of one div flow smoothly into the background-color of the next div. Since I couldn't ...

error message remains visible even after correct input is entered

I am new to React and attempting to create a multi-step form using Reactjs and Material-ui. The form validation and submit buttons are working perfectly fine. However, I have encountered an issue with the code where if a field is empty and I try to proceed ...

What is the best way to update a data value in one Vue Js component and have it reflected in another component?

I'm a newcomer to Vue Js and encountering an issue with changing data values from another component. Let's start with Component A: <template> <div id="app"> <p v-on:click="test ()">Something</p> </div> ...

When using Vuetify's v-text-field with the type "number", remember to assign a null value instead of an empty string

One issue I've encountered is that when using v-text-field with the type="number" attribute, the value is set to an empty string after manual clearing. Ideally, I would like it to return null in such instances. Is there a way to set an attr ...

How can I transfer data to a different component in Angular 11 that is not directly related?

Within the home component, there is a line that reads ...<app-root [message]="hii"> which opens the app-root component. The app-root component has an @input and {{message}} in the HTML is functioning properly. However, instead of opening t ...

Place a Three.js scene within a jQuery modal dialogue box

I am attempting to integrate a Three.js scene into a jQuery modal window. The objective is to utilize the Three.js scene in a larger window size. This scene should be displayed after clicking on an image that represents the scene in a smaller dimension. Y ...

Error message: "In Jade and Express.js, the attribute req.body.[name of form] is not defined

I am encountering an issue while trying to update a database using a drop-down form. The problem is that req.body.[name of form] is coming up as undefined. Upon checking the console, I found that req.body shows up as an empty object {}. Below is the code ...

In JavaScript, constructors do not have access to variables

Currently, I am attempting to implement Twilio Access Token on Firebase Functions using TypeScript. export const generateTwilioToken = functions.https.onRequest((req, res) => { const twilioAccessToken = twilio.jwt.AccessToken; const envConfig = fun ...

Issue with disabling elements using jQuery in IE 10

I'm encountering a problem with using attr('disabled', 'disabled') or prop("disabled", true) in Internet Explorer when using jQuery. This works fine in Firefox and Chrome but not in IE. Any suggestions? I'm attempting to disa ...

Displaying the overall count for a bar chart within the tooltip title of a c3js visualization

I have a bar chart that looks similar to the one presented in this example. There are two specific features I am interested in adding to this bar chart: Instead of numeric values, I would like the tooltip title to show the sum of the counts represente ...

The latest pathway fails to refresh in NextJs

I've implemented a search bar at the top of my app which directs to /search/[searchId].js page: <Link href={`/search/${search}`}> <button type='submit' className='btn-cta btn-3'>SEARCH</button> < ...

Using ASP.NET MVC and jQuery Ajax to close and refresh a parent table from a modal dialog

I am relatively new to both MVC and jQuery, and I'm struggling to make them work together. I've managed to put together a modal dialog form with an ajax postback, but the UI is presenting challenges for me. Despite looking for examples of MVC and ...

Determine the originating component in React by identifying the caller

Can you explain how to access the calling component in a React application? function MyCallingComponent() { return <MyReadingComponent/> } function MyReadingComponent() { console.log(callingComponent.state) } ...