show() : It displays selected elements.hide() : It hides the selected elements.toggle() : It shows or hides the selected elements, i.e. it toggles between hide() and show() methods.<heade>, <footer>, <article>, <aside>, <details>, <figure>,
<figcaption>, <main>, <mark>, <nav>, <section>, <summary>, <time>.​<>. Tags usually come in pairs and surround the text.
*" and end with " –>".
var example_object =
{
name: "ramana",
age: 31
height: 162
};​<header> : header for a document or a section is defined in this<nav> : defines a container for navigation links<section> : A section in a document is defined <article> : an independent, self-contained article is defined<aside> : example is a sidebar, that is aside of content<footer> : footer of a document is defined herereset.css and normalize CSS is that reset.css removes all the built-in browser styling capabilities like margin, padding, and border. normalize CSS provides a book-like appearance that includes a bold family to represent characters, a border between two paragraphs and a common font-family for an entire page of the document. <a> : This inline element includes hyperlinks in the webpage.<br> : This inline element mentions line breaks in the webpage where ever needed.<script> : This inline element is used to include external and internal JavaScript codes.<input> : This inline element accepts input from the users and is mainly used in forms.<img> : This inline element includes different images in the webpage to add beauty to the webpage.<span> : This inline element is an inline container that takes necessary space only.<b> : This inline element is used in places where bold text is needed.<label> : This inline element provides a usability improvement for mouse users, i.e., if a user clicks on the text within the <label> element, it toggles the control.<h1>-<h6> : These elements include headings of different sizes ranging from 1 to 6. Here, the smaller the number, the bigger the heading size.<div> : This element is used to make separate content divisions on the web page.<li> : This block element includes list items of an ordered or unordered list.<ul> : This block element is used to make an unordered list.<ol> : This block element is used to make an ordered list.<hr> : This block element is an empty tag used to separate content by horizontal lines.<p> : This block element includes paragraphs of content in the webpage.<table> : This block element includes the tables in the web page when it requires tabular data.<header> : This semantic block element includes all the main things of the webpage like navbar, logos, and heading of the webpage.<nav> : This semantic block element helps navigate different sections by including different blocks of hyperlinks in the webpage.<footer> : This semantic block element contains all information about the web page's authorization, contact, and copyright details.<main> : This semantic block element is used to specify the main content of the webpage.<section> : This semantic block element is used to specify separate different sections in the webpage.<article> : This semantic block element includes different independent articles on the webpage.<aside> : This semantic block element mentions details of the main content aside.<!DOCTYPE html>
<html>
<head>
<meta name="description" content="web page with description like (Tutorlas, Interview Question, etc,.)">
<title>Free Time Learn</title>
</head>
<body>
</body>
</html>​| DIV | SPAN |
|---|---|
| It is utilized for separating the elements that are block-line, line break before and after it. | Span is utilized for grouping inline elements in the HTML doc. |
| It contains global attributes for the certain element in HTML documents. |
It includes certain, global and event attributes. |
| At times para tag <P> is utilised for inner side of the <div> tag. | In a paragraph, <span> tag is utilized to use a CSS style for certain words with the selected font sets. |
| In div tag, we make use of borders with width height with specified color pixels to emphasize the front end document. | In the Span tag, we utilize specified color coding to depict the front-end document. |
npm stands for Node Package Manager. npm provides the following two main functionalities :Node.js packages/modules which are searchable on search.nodejs.orgNode.js packages.npm install from the project root and npm will install all the dependencies listed in the package.json.​<meta name="viewport" content="width=device-width,initial-scale=1.0,user-scalable=yes">Media queries examples :
@media only screen and (min-width:300px) and (max-width:480px){
.samplefile{
width:96%;
padding : 10px;
margin : 5px auto;
background-color: blue;
}
}
@media only screen and (min-width:1100px){
.samplefile{
width:96%;
padding : 10px;
margin : 5px auto;
background-color: gray;
}
}| HTML | XHTML |
|---|---|
| HTML is an acronym that stands for Hypertext Markup Language. It is the most widely used language over the internet. | XHTML is an acronym that stands for Extensible Hypertext Markup Language. |
| HTML is a language used to create web pages and link them from one to another. | XHTML is considered a part of the XML markup language. It contains the features of both XML and HTML. |
| Tim Berners-Lee developed HTML in 1991. | XHTML was developed by W3C, i.e., World Wide Web Consortium, and was released in 2000. |
| HTML is extended from SGML and follows the format of document file format. | XHTML is extended from XML and HTML and follows the markup language format. |
| In HTML, it is not necessary to write Doctype at the top. | In XHTML, you must write Doctype at the top of the file. |
| HTML is not strictly case-sensitive. It is not necessary to put all tags in lower or upper case. | XHTML is strictly case-sensitive. Here, you have to put every tag and attribute in lower case. |
| In HTML, it is not necessary to close the tags in the order they are opened. | In XHTML, you must close the tags in the order they are opened. |
| HTML is an older language for linking web pages on the internet. | In comparison, XHTML is called a better version of HTML. |
| In HTML, it is not necessary to mention quotes while using attributes. For example: <JavaTpoint>. | In XHTML, it is mandatory to mention quotes while using attributes. For example: <JavaTpoint="JTP">. |
| In HTML, filename extensions are used as ".html", and ".htm". | In XHTML, filename extensions are used as ".xhtml", ".xht", ".xml". |
| Git fetch | Git pull |
|---|---|
| The Git Fetch command downloads only new data from a remote repository. The Git fetch command is more like checking to see if any changes are available. | The Git pull command pulls new data and integrates it with the current working files, updating the current HEAD branch with the latest modifications from the remote server. |
| The Git fetch command does not include any new information in your working files. | The Git pull command combines remote modifications with those made locally. |
< ul > tag, which stands for “unordered,” whereas < ol > is used to create an ordered list.
<>.<href> attribute is used to specify the website link.<href> specification will be “mailto:example@domain.com”.let customers = [
{ id: 0, name: 'free' },
{ id: 1, name: 'time' },
{ id: 2, name: 'learn' }
];
let customer = customers.find(cust => cust.name === 'learn');
console.log(customer);
--> { id: 2, name: 'learn' } var data={ID:1, first_name:"Ramana", second_name:"Reddy"};
var send_data=JSON.stringify(data);​let data = [
"files/dir1/file1",
"files/dir1/file2",
"files/dir2/file1",
"files/dir2/file2"
];
let filteredData = data.filter(path => path.includes('dir2'));
console.log(filteredData);
--> [ 'files/dir2/file1', 'files/dir2/file2' ]​var add = function(a,b){consol.log(a+b)}
add(4,5); //9| Null | Undefined |
|---|---|
| A null is an object with no value. | Undefined is a type. |
| Null is an intentional absence of the value. It is one of the primitive values of JavaScript. | In Undefined, the value does not exist in the compiler. It is the global object. |
typeof null; // "object" |
typeof undefined; // "undefined" |
| Null is equal to undefined but not identical. null == undefined // true |
null === undefined // false |
| A variable is defined as null when trying to convey that the variable is empty. | A variable is defined as undefined when we try to convey that the variable does not exist or is not available. |
| Null is also referred to as false. Example : null ? console.log("true") : console.log("false") // false |
When a variable is not assigned a value, it is called Undefined. Example : var temp;if(temp === undefined)console.log("true");elseconsole.log("false"); |
<input type="text" value="Tech">var data = document.querySelector(input); // here we created a document object of input tag
console.log(input.getAttribute('value')); // tech // getting the attribute value
console.log(input.value); // tech // getting the property of the input object<script>
function add(a,b){
return a+b;
}
function print(n){
console.log(`Two times the number ${n} is `+add(n,n));
}
print(5);
</script>​Output :
Two times the number 5 is 10== denotes abstract equality operator, and it inspects if two values are equal or not apart from their data types. Automatically, it transforms the type of both the operands and compares them.1=='1'; //true
1==1; // true=== denotes identity equality operator, and it inspects the values of both the operands and their data type. The outcome of the operation will be true considering both the operands are equal and have the same data type, or else it returns false.1===1 //true
1==='1' // false<a>, <href>, <button>, and <div> etc. are HTML tags and src, class, and id etc. are the example of HTML attributes.<img src="myhome.jpg" alt="A photo of my home."> <img> tag.| HTML Tags | HTML Attributes |
|---|---|
| HTML tags are generally the starting and ending parts of the HTML code. | HTML attributes are used to define the character of the HTML elements. |
| HTML tags define a way to represent and hold HTML elements in the program. | HTML attributes are generally used to provide additional styling to the element. |
HTML tags begin with < symbol and end with > symbol. |
HTML attributes are always placed in the opening tag of an element. |
| HTML tags are like keywords where every single tag has a unique meaning. | HTML attributes provide various additional properties to the existing HTML element. |
| HTTP Requests | Description |
|---|---|
| GET | It is sent when we wish to recover data from the server. GET request is the most typically used HTTP request. |
| HEAD | The HEAD is a reaction that is the same as the GET request but doesn’t possess a message-body in the response. The HEAD request method is beneficial in retrieving meta-data that is documented as per the headers, without transferring the entire content. The method is commonly utilised when testing hypertext links for recent change, accessibility, and validity. |
| TRACE | TRACE requests are implemented to invoke a remote, application loop-back test along the path to the target resource. The TRACE method lets users to witness whatever message is being received at the other end of the request chain so that they can utilise the data for testing or diagnostic functions. |
| POST | This request is utilized to transmit data from the user to the server. By submitting web forms, these requests can be made. The POST request is generally utilized to build data in the database. For instance, when we build a new account on any webpage, we make use of the POST request. |
| PUT | It is identical to POST, but it is utilized to revise the existing data on the server. For instance, when we wish to revamp our complete account on a web page, we utilize the PUT request. |
| PATCH | It is identical to PUT and is utilized when we wish to revise a certain field of our data. For instance, when we just wish to update our name or any additional information about our account, we can make use of the PATCH request. |
| HTTP Status codes | Description |
|---|---|
| HTTP Status Code 301 - Permanent Redirect | Any time one URL needs to be redirected to another permanently, a 301 redirect should be used. A 301 redirect implies that bots and visitors that come on that page will be taken to the new URL. Link equity is also passed to the new URL via a 301 redirect. |
| HTTP Status Code 302 - Temporary Redirect | 302 redirect is just like a 30, where it passes visitors and bots to the new page, but it may not pass along link equity. It is not recommended using 302 redirects for permanent changes. |
| HTTP Status Code 404 - Not Found | This implies the server did not find the file or page that the browser is requesting. 404s don’t show whether the missing resource or pages are missing temporarily or permanently. You can check what this appears to be on your site by writing in a URL that doesn’t exist. Every site will have some pages that display the 404 status codes. |
| HTTP Status Code 200 - OK | This is the ideal status code for a properly functioning page. |
| HTTP Status Code 410 - Gone | A 410 implies the page is no longer available from the server and they have set no forwarding address. Any links you present on your site that are directed to a 410 page are sending visitors and bots to a dead resource. |
| HTTP Status Code 500 - Internal Server Error | This status code shows a problem with the server and will affect access to your site. Bots and human visitors alike will get lost, and your link equity will go nowhere fast. |
| HTTP Status Code 503 - Service Unavailable | 503 response, shows that the server is unavailable. This could be because of temporarily overloading the server or maintenance of the server. |