Article Categories
- All Categories
-
Data Structure
-
Networking
-
RDBMS
-
Operating System
-
Java
-
MS Excel
-
iOS
-
HTML
-
CSS
-
Android
-
Python
-
C Programming
-
C++
-
C#
-
MongoDB
-
MySQL
-
Javascript
-
PHP
HTML Articles
Page 4 of 151
How to embed JavaScript in HTML file?
Following is the code to embed JavaScript in html file −Example Document body { font-family: "Segoe UI", Tahoma, Geneva, Verdana, sans-serif; } .result { font-size: 18px; font-weight: 500; color: rebeccapurple; } Embed javascript in html file let resEle = document.querySelector(".result"); resEle.innerHTML += "Inline javaScript loaded" + ""; script.jsresEle.innerHTML += 'External JavaScript loaded ';OutputThe above code will produce the following output −
Read MoreHow to disable autocomplete of an HTML input field?
To disable autocomplete of an input field, the code is as follows −Example input{ font-size: 18px; padding: 10px; margin: 10px; border:1px solid grey; } Autocomplete on/off Example First name: Last name: Type in the above fields and refresh page to see autocomplete at work OutputThe above code will produce the following output −On typing something in the above fields after submitting the form one time −
Read MoreHow to turn off spell checking (grammar correction) for HTML form elements?
To turn off spell check for form elements, the code is as follows −Example Disabling Spellcheck Example Your Name: About Yourself Type wrong spelling in the above input field to see spellcheck in action OutputThe above code will produce the following output −On typing something in the input fields −
Read MoreHow to sort an HTML list using JavaScript?
To sort an HTML list using JavaScript, the code is as follows −Example Sorting list example Click to sort Giraffe Camel Dog Lion Cheetah Cat document .getElementsByTagName("button")[0] .addEventListener("click", sortList); function sortList() { var list, i, sortFlag, LiEle, sorted; list = document.querySelector(".animalList"); sortFlag = true; while (sortFlag) { sortFlag = false; LiEle = list.getElementsByTagName("LI"); for (i = 0; i < LiEle.length - 1; i++) { ...
Read MoreHow to create a download link with HTML?
To create a download link with HTML, the code is as follows −Example Download Link example Click on the image above to download it OutputThe above code will produce the following output −
Read MoreHow to display XML in HTML in PHP?
If the string is pre-formatted, and a plain text representation of the same is needed, it can be wrapped in a HTML tag and html entities can be used to escape the angle brackets. This has been shown below −The string is assigned to a string type and the above is used to show XML in HTML −ExampleOutputThis will produce the following output − EXAMPLE
Read MoreHTML DOM TouchEvent Object
The HTML DOM TouchEvent Object represents an event which incurs on interaction with the HTML document elements using touch devices.Here, “TouchEvent” can have the following properties and methods −Property/MethodDescriptionaltKeyItreturns a Booleanvalue corresponding to the state if alt key was pressed when atouch event was firedchangedTouchesItreturns aTouchList object corresponding to a list of all contact pointstriggered on a state change of touch eventsctrlKeyItreturns a Booleanvalue corresponding to the state if ctrl was pressed when a touchevent was firedmetaKeyItreturns a Booleanvalue corresponding to the state if meta was pressed when a touchevent was firedshiftKeyItreturns a Booleanvalue corresponding to the state if shift ...
Read MoreHTML DOM Meter value Property
The HTML DOM Meter value property returns/sets a number corresponding to the value attribute of a element. Use this with high, low, min and max attributes for better results.NOTE: Don’t use as a progress bar but only as a gauge.Following is the syntax −Returning value of the value propertymeterElementObject.valueValue of the value property setmeterElementObject.value = numberLet us see an example of Meter value property −Example Meter value form { width:70%; margin: 0 auto; text-align: center; } * { padding: 2px; ...
Read MoreHTML DOM Object form Property
The HTML DOM Object form property returns the reference of enclosing form for element.Following is the syntax −Returning reference to the form objectObjectElement.formLet us see an example of Object form property −Example HTML DOM Object form form { width:70%; margin: 0 auto; text-align: center; } * { padding: 2px; margin:5px; } input[type="button"] { border-radius: 10px; } HTML-DOM-Object-form var divDisplay = document.getElementById("divDisplay"); var objSelect = document.getElementById("objSelect"); function getObjectForm() { divDisplay.textContent = 'Location of above picture: '+objSelect.form.id; } OutputBefore clicking ‘Get location of pic in website’ button −After checking ‘Get location of pic in website’ button −
Read MoreHTML DOM Ol type Property
The HTML DOM Ol type property sets/returns the value of the type attribute which corresponds to the type of marker used in an ordered list.Following is the syntax −Returning type propertyolObject.typeSetting type to a characterolObject.type = ‘1|a|A|i|I’Let us see an example of Ol type property −Example HTML DOM Ol type form { width:70%; margin: 0 auto; text-align: center; } * { padding: 2px; margin:5px; } input[type="button"] { border-radius: 10px; } ol{ ...
Read More