The reason why the script and div tags are so common in HTML is because they serve different purposes. However, it's

Hey there, friend! I've searched on baidu.com, cnds, and stack overflow, but couldn't find an answer. I have two questions: "why can script and div tags be used so much in HTML?" and "why is there only one html and body tag in HTML?" For example:

<!DOCTYPE html>
<html lang="en">
<head>
</head>
<head>
</head>
<head>
</head>
<head>
</head>

<body></body>
<body></body>
<body></body>
<body></body>

</html>

doesn't seem to work

However,

<!DOCTYPE html>
<html lang="en">

<head>
    <script type="text/javascript">
        document.write("Hello World!")
    </script>
    <script type="text/javascript">
        document.write("Hello World!")
    </script>
    <script type="text/javascript">
        document.write("Hello World!")
    </script>
    <script type="text/javascript">
        document.write("Hello World!")
    </script>
    <script type="text/javascript">
        document.write("Hello World!")
    </script>
</head>

<body></body>

</html>

works fine

Is it because of the browsers' base code? Please explain why, thank you very much! Your friend, zt :)

Answer №1

The HTML specification (unfortunately is not available in all languages) could be a valuable resource to assist you.

Essentially, an HTML page is structured in a hierarchical tree format.

<html>
  <head>
    // ..metadata, CSS, JS
  </head>
  <body>
    // document elements here
  </body>
</html>
 

The main HTML document should have only one <head> and one <body> element.

<head> section contains meta-data, links to CSS, and often links to JS scripts. Depending on the application being developed, there may be a substantial amount of CSS and JS. These could be self-created scripts or links to online resources stored in an open-source CDN.

<body> will house the main content of the page - all of the elements, headings, sections, paragraphs, etc. It may also include links to scripts, as sometimes these scripts require the document and its elements to be loaded before execution.

I recommend delving into documentation available in multiple languages and various tutorials on creating HTML pages. With practice, your understanding will grow.

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

What is the best way to select an element that is currently visible but hidden underneath another element?

I have developed a circular graphic using primarily HTML and CSS, with some JavaScript and JQuery functionalities incorporated for text curving and planned interactions in the future. However, I've encountered an issue where clicking on the upper rig ...

Flickering transitions in Phonegap and jQuery Mobile pages

As a beginner in Phonegap/jQuery Mobile, I have encountered a frustrating issue of a white screen appearing during page transitions. Despite trying various solutions found online, such as using -webkit-backface-visibility:hidden;, the problem persists. I ...

Create a dropdown menu using a PDO query to populate the selectable options

I need to create a Select List that dynamically populates items/information from a Query. I understand the importance of updating the select list every time the database is updated, so JQuery is required for this task. Although I have limited experience wi ...

When conditions are met, all items are added to the array

In my Angular app, I have a user list that I am trying to filter based on the condition age > 45. However, all users are being pushed into the validForScheme array instead of just those meeting the condition. I am unable to figure out what is going wron ...

The ng-change event in AngularJS is not being activated by IE 11

Hello everyone, I am currently working with the angularjs framework and implementing a datepicker functionality. Unfortunately, the input type date is not functioning correctly on Internet Explorer. As a workaround, I have utilized jquery and css to create ...

The initial $http POST in Angular ends up hitting the error path within the .then function despite the successful execution of the

Something strange is happening to me. This peculiar behavior occurs only on the initial POST request. However, when I resubmit the form, the subsequent requests work perfectly fine. The first $http post call leads to the error function in .then, even thou ...

Maintaining consistent height using JavaScript

Dealing with equal height using just CSS can be a hassle, especially when you want to support older browsers like IE9. That's why I've decided to use JavaScript instead. If a user disables JavaScript, having unequal heights is the least of my con ...

The issue of req.file being undefined when using Multer in Node.js with Express Router

I have been working on incorporating File Upload capability utilizing multer and Express Router. I set up an endpoint /batch_upload using router.use in the following manner: api.js router.use( "/batch_upload", upload.single("emp_csv_data"), userCo ...

Issue with Swiper js "autoheight" not resizing correctly for the height of the first slide upon page initialization

Hey everyone, I'm encountering a problem with my reactapp and I'm not sure how to resolve it. I've spent a considerable amount of time searching on stackoverflow but haven't come across any helpful solutions. The issue is related to a ...

Tips for importing a different js file from an npm package without needing to include the entire node_modules path

When using the ES2016 import syntax to load the select2 library from an npm module via Webpack, everything works smoothly and the select2.js file is loaded from the node_modules directory. The node_modules directory also contains a full version of the lib ...

Looking for a demonstration using dust.js or handlebars.js in a two-page format with express3.x and node?

Currently, I am in the process of selecting a templating engine to use. While I have come across numerous single-page examples utilizing template engines, I am specifically searching for a practical example that demonstrates handling two distinct pages whi ...

What's the best way to prevent extra spacing when typing in a materialUI TextField?

Instructions for the user: Please input your first name without any spaces between characters. I attempted to implement the following code, however, it did not achieve the desired outcome. <TextField required id="name" label="First Name" ...

Adjusting the size of the snap increments

When using gridstack, I have the ability to resize my widgets. However, I've noticed that when dragging on the widgets' handles, they snap to specific sizes, which seems to be a fixed amount. If I wanted to set the widget's size to something ...

Error Loading JQuery: The function $() is not recognized in the Shopify platform

I seem to be overlooking something obvious. I am using Shopify and have included jQuery in the head section of the theme.liquid file: <script src="//ajax.googleapis.com/ajax/libs/jquery/1.9.1/jquery.min.js"></script> This script is placed rig ...

What is the reason behind React re-rendering child components despite passing props that have been memoized with useMemo?

While exploring this topic, I stumbled upon an answer that seems relevant: When does React re-render child component? However, my inquiry delves into a more intricate question. Why does React typically re-render child components when utilizing the useMemo ...

Receiving an error of "Undefined" when attempting to retrieve an array that is nested within an object

I've been struggling with the same question for a while now. Despite my knowledge of dot and bracket notation, as well as attempts using empty keys, I'm still unable to make it work. The situation involves a JSON array of objects obtained from an ...

In Javascript, ensuring a stopping condition for a recursive function that is looping through JSON data

I am having trouble figuring out how to set the break condition for this recursive function. Currently, the function is causing the browser to freeze (seems to be stuck in an endless loop). My goal is to create a series of nested unordered lists based on ...

Integrating Facebook login with Cordova using the cordovaOauth plugin

Encountering issues while setting up FB login for my cordova mobile app. A tutorial followed: http://www.codeproject.com/Tips/1031475/How-to-Integrate-Facebook-Login-into-a-Cordova-App#_comments <script src="js/angular.js"></script> <scrip ...

Utilize Vue.js to sort by price bracket and category

Hello, I am currently new to working with Vue.js and I am attempting to create two filters - one for price range and the other for genre. Any guidance or assistance would be greatly appreciated. Below is a snippet of my code: ul class="filter-wrapper"&g ...

Developing 2 potential results from textarea input using NODE.JS and HTML

Today, I encountered an issue while working on my bot website project that responds to textarea input. When I attempted to test it with two different commands, one of the commands stopped working unexpectedly. I'm puzzled by this and would greatly app ...