Tips for Utilizing Both getElementByID and getElementByTagName Functions in JavaScript

Hi! I'm a beginner in JavaScript and I've managed to retrieve some data using getElementById. Now, I want to extract a specific part using getElementsByTagName.

document.getElementById('titleUserReviewsTeaser').innerHTML;
"
        <h2>User Reviews</h2>
        <div class="user-comments">
                    <div class="tinystarbar" title="10/10">
                        <div style="width: 100px;">&nbsp;</div>
                    </div>
                <span itemprop="review" itemscope="" itemtype="http://schema.org/Review">  
                    <strong itemprop="name">Awesome review for an awesome movie</strong>
                    <span itemprop="reviewRating" itemscope="" itemtype="http://schema.org/Rating">
                        <meta itemprop="worstRating" content="1">
                        <meta itemprop="ratingValue" content="10">
                        <meta itemprop="bestRating" content="10">
                    </span>
                    <div class="comment-meta">
                        25 August 2005 | by <a href="/user/ur6899565/?ref_=tt_urv"><span itemprop="author">Dragondrawer88</span></a>
                        <meta itemprop="datePublished" content="2005-08-25">
                              (United States)
                        – <a href="/user/ur6899565/comments?ref_=tt_urv">See all my reviews</a>
                    </div>
                    <div>
                        <p itemprop="reviewBody">Balto has been a favorite movie of mine ever since it came out. This is the touching story of an out casted half dog half wolf named Balto voiced by the talented Kevin Bacon who's voice added a slight charm to the Balto character. The story takes place in Nome Alaska in the year 1925. A sickness as stricken the town's children and with out the antitoxin which is located hundreds of miles away in town of Nanana, the children will surly die. The dog team sent to retrieve the medicine which is led by Balto's almost arch nemesis Steel, is lost in a horrible snow storm. Now...
                    </p>
                    </div>
    // The code continues here

Now, I'd like to extract the data between <p itemprop="reviewBody"> and </p> tags. How can I achieve this?

Answer №1

document.getElementById('titleUserReviewsTeaser').innerHTML.getElementByTagName("p"); 

Let's correct a couple of errors in the code snippet provided. Firstly, there is a typo in the method name - it should be getElementsByTagName instead of getElementByTagName. This function returns a NodeList of elements with the specified tag name.

Secondly, keep in mind that innerHTML is a property that represents the HTML content of an element as a string, not an actual DOM node. To access child elements within the target element, you should first call getElementsByTagName on the parent element itself.

document.getElementById('titleUserReviewsTeaser').getElementsByTagName("p")

Answer №2

Give this a shot:

console.log(document.querySelector("h1").innerText);

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

Unable to access $_SESSION variable when making AJAX request from a different port

After creating a website with PHP on port 80 (index.php) and setting the session variable with the userid upon login, I encountered an issue when clicking on a link that redirected me to port 8080, which is where a JavaScript file containing node.js proces ...

obtaining data from a JSON object in Node.js

Retrieve response in function node.js [ { instrument_token: '12598786', exchange_token: '49214', tradingsymbol: 'AARTIIND21JAN1000CE', name: 'AARTIIND' }, { instrument_token: '125998 ...

Can jQuery script be used within a WordPress page for inline execution?

Can jQuery be executed in the middle of a page (inline)? I attempted to run the following code within a custom WordPress template.... <script type="text/javascript"> jQuery(document).ready( function() { jQuery(".upb_row_bg").css("filter","blur(30 ...

Understanding the concept of event bubbling through the use of querySelector

I am currently working on implementing an event listener that filters out specific clicks within a container. For instance, in the code snippet below I am filtering out clicks on elements with the class UL.head. <div> <ul class="head"> < ...

Using Jquery and Ajax to pass an extra PHP variable to a server-side script

I am working with a dropdown select box where the selected option is sent to a server-side script using Ajax. <select id="main_select"> <option selected="selected" value="50">50</option> <option ...

Display multiple markers on a Google Map using google-map-react library

I am currently struggling to display markers on my Google Map using the map function. I have tried various approaches but nothing seems to work. Could there be limitations that I'm not aware of, or am I overlooking something critical? I experimented w ...

JavaScript enables users to store over 5 megabytes of data on their client devices

Is there a way to store more than 5mb in the client browser? I need this functionality across various browsers including Firefox, Chrome, Internet Explorer, Safari (iOS), and Windows Phone 8 Browser. Initially, localStorage seemed like a viable option as i ...

Setting the position of a tooltip relative to an element using CSS/JS

I'm struggling to make something work and would appreciate your help. I have a nested list of items that includes simple hrefs as well as links that should trigger a copy-to-clipboard function and display a success message in a span element afterwards ...

Is there a method in JavaScript to prevent href="#" from causing a page refresh? This pertains to nyroModal

Is there a way to prevent <herf="#"> from causing a page refresh? I am currently working on improving an older .NET web project that utilizes nyroModal jQuery for displaying lightboxes. However, when I attempt to close the lightbox, nyroMo ...

What is the best way to choose $(this) within a JavaScript expression inside a template literal?

Is it possible to use template literals in the append method and get the index of the row generated? I understand that calling "this" inside the function selects the specified selector passed as an argument. $(document).on('click', '.ad ...

My changes to the HTML file are not being reflected in the browser, even after clearing the cache. This is happening in an Angular and Node.js application

I'm currently developing an application using Angular and Node.js. I've noticed that when I make changes to the HTML file, the browser isn't updating even after clearing the cache. Could this be a coding issue? Any suggestions on how to fix ...

When a previous form field is filled, validate the next 3 form fields on keyup using jQuery

Upon form submission, if the formfield propBacklink has a value, the validation of fields X, Y, and Z must occur. These fields are always validated, regardless of their values, as they are readonly. An Ajax call will determine whether the validation is tru ...

Include CLI input into JavaScript variable within the Webpack build process

I am currently attempting to incorporate a variable into my app.js file during the build process. For instance: //app.js var myvar = {{set_from_cli}}; Afterwards, I would like to execute something such as webpack -p --myvar='abc' which would pr ...

What is the purpose of using async/await in Node.js when it is inherently asynchronous, and in JavaScript as well, vice versa?

Apologies for my lack of experience in Javascript and NodeJS. I'm a total beginner, so please excuse my silly questions. I've been trying to wrap my head around the concept but haven't found a clear explanation. Here's what's conf ...

Unable to retrieve context value for authentication requirements

I have implemented a feature in my application where I redirect users to the login page for certain special pages if they are not logged in. The implementation involves using react-router. Here is the code snippet for my RequireAuth component: const Requir ...

How can we compress videos on an Android device prior to uploading them through a web browser?

Can video compression be done prior to uploading via a web browser? For example, in iOS devices you can choose a video using the HTML input type file tag and iOS will automatically compress it before uploading. Are there any JavaScript or jQuery libraries ...

"Exploring the world of mocking module functions in Jest

I have been working on making assertions with jest mocked functions, and here is the code I am using: const mockSaveProduct = jest.fn((product) => { //some logic return }); jest.mock('./db', () => ({ saveProduct: mockSaveProduct })); ...

Trigger $q manually in AngularJS

My understanding of $q in AngularJS is that it runs every time I refresh my page, similar to using a function in ng-init. Here is the code for $q.all that I have: $q.all([$scope.getCart(), $scope.getCategory(), $scope.getMenu(), $scope.getRestaurant()]). ...

retrieving data from array elements

{ "success": true, "users": [ { "photo": { "id": "users/m1ul7palf4iqelyfhvyv", "secure_url": "https://res.cloudinary.com/dpbdw6lxh/image/upload/v1665251810 ...

Retrieve the text inside the DIV that contains the clicked link

I'm facing an issue with my JS code: $(document).on("click", '.like', function (e) { $(this).parent().html("<a href = '#' class = 'unlike'><div class = 'heart'></div></a>"); ...