Xah Web Dev Blog Archive 2024-01

minor update

• HTML: List: ul ol li
• HTML: Nested List
• CSS: Flowing List
• HTML: Definition List: dl dt dd

• Duckduckgo Censor Results
• Brave Search

• User Interface Design

• CSS: Comment Syntax

lots update.

• CSS: Selector Tutorial
• CSS: Selector: Match Tag Name
• CSS: Selector: Match Attribute
• CSS: Selector: Match Root Element
• CSS: Selector: Match Parent
• CSS: Selector: Match Children
• CSS: Selector: Match Sibling
• CSS: Pseudo-Class Selectors
• CSS: Pseudo-Element Selectors
• CSS: Selector Negation
• CSS: Selector Syntax Shortcuts

• HTML: the Root Element
• CSS: Variable (Custom Property)

• CSS: Selector Classification

• CSS: Test Sibling Selector
• CSS: Test Selector Omit Tag Name

• 🆕 CSS: Selector: Match Root Element
• CSS: Selector: Match Parent
• CSS: Selector: Match Sibling
• CSS: Selector Syntax Shortcuts

• HTML: the Root Element

advanced CSS. updated.

• CSS: Selector: Match Attribute

• CSS: Reset, Default Values

• Web Domain Farm Spam (2018)

• World Multiconference on Systemics, Cybernetics and Informatics

• Internet Explorer Anime Girl

• JS: Random Array Element, Randomize Array 📜

• HTML: Tags

from 10 years ago

• Facebook Fraud (2014)

• JS: Factorial 📜

major update

• CSS: Tabbed Menu
• Visual CSS

• CSS: Text Shadow

• JS: Function Pipe 📜
• JS: Array How-To
• JS: Range Function for Array 📜
• JS: Deep Copy Array or Object 📜
• JS: Literal Expression for Map

Understand JavaScript like a mathematician.

• JS: Object Overview
• JS: this (binding)

• Chinese Font on Mac

major update

• Chinese Font on Windows

• 🆕 HTML: Language Attribute
• HTML: Meta Language Tag Obsolete

updated.

• CSS: font
• Metrically Compatible Fonts

• Chinese Font
• Chinese Font on Windows
• Chinese Font on Mac

• CSS: Length Units

updates

• JS: Property Overview
• JS: Property Key
• JavaScript: Exclamation Before Function

• Cascadia vs Consolas

• JS: Switch Statement

Now you can use Cascadia Font. Designed to replace Consolas.

• CSS: Common Web Fonts

• Google Tweaks YouTube to Make Microsoft Browser Slower (2018-12)

• CSS: Reset, Default Values

• CSS: Text Flow Multi-Column Layout

• HTML: XML Entities (Special Characters)

minor update

• JS: Quote String
• JS: Unicode Escape Sequence

• CSS1 and CSS2 Differences

• Google HTML5Rocks (2010)

updates.

• JS DOM: Button
• JS DOM: Input Text Field
• JS DOM: Password Text Field
• JS DOM: Textarea
• JS DOM: Email Field 📧
• JS DOM: Input Number Field
• JS DOM: Radio Button 🔘
• JS DOM: Checkbox ☑
• JS DOM: Selection, Popup Menu ▤
• JS DOM: Input Range Slider 🎚
• JS DOM: Color Picker 🌈

• JS DOM: Change Element Content

• HTML: Ruby Tag (Chinese Character Annotation)

• CSS: Table Layout

• CSS Property Names in JavaScript

• HTML: Ruby Tag (Chinese Character Annotation)

updates.

• CSS: Position Property
• CSS: Position Relative
• CSS: Position Absolute
• CSS: Position Fixed
• CSS: z-index
• HTML: the Root Element
• CSS: Computed Style

new version out. buy it. thanks. Buy JavaScript in Depth

• SVG: Animate Tag

minor update and repost

• SVG: Basic Shapes
• SVG: Animate Tag
• Google and Amazon Generates Invalid HTML
• HTML Correctness and Validators
• CSS: Add CSS to HTML

• HTML: Allowed Characters in id Attribute
• HTML: Charset and Encoding

• HTML: XML Entities (Special Characters)

• YouTube Spam Comments of Random Person Names (2024)
• Web Spam, Scam, SEO

• SVG: Specifying Styles

• CSS: Shrink Wrap

• JS: String Code Unit

massive updates.

• JS DOM: Get Element by ID, Name, Class etc
• JS DOM: Iterate HTMLCollection
• JS DOM: Get Element Parent, Child, Sibling

• JS DOM: NodeList vs HTMLCollection JS DOM: Live Object

• JS DOM: List, Add, Remove Class Attribute
• JS DOM: Insert, Remove, Replace Element

• JS DOM: Node, Node Type, Element
• JS DOM: Node Type
• JS DOM: Node Name
• JS DOM: Node value
• JS DOM: textContent, innerHTML, innerText, nodeValue
• JS DOM: Whitespace Nodes
• JS DOM: History of GetElementsByClassName

• JS: Iterable Object
• JS: Interface

• HTML: Glossary

• JS DOM: Browser Window Object
• JS DOM: Get URL (window.location)

• JS: Symbol Tutorial

• JS: How to Use Browser Console

updates

• CSS: Media Query
• CSS: Variable (Custom Property)
• CSS: calc
• CSS: Reset, Default Values
• CSS: Dark Theme
• CSS: Prevent Right Click
• CSS: Data URI Scheme
• CSS: protocol-relative URL
• CSS: Declare Charset
• CSS: Responsive Table
• CSS: Fixed Aspect Ratio
• CSS: Add Icon to Links

old articles.

• JavaScript Books Review 2023
• Book Review: JavaScript by David Flanagan
• JavaScript, Design Patterns Approach to Computer Language Tutorials

• CSS: Reset, Default Values

updates

• CSS: Color Syntax
• CSS Color Names
• 🆕 CSS: RGB Color
• CSS: HSL Color
• CSS: Opacity (Transparency)
• CSS: Linear Gradient
• CSS: Radial Gradient

more updates

• 🆕 JS: Literal Expression for Map
• 🆕 JS: Map Substract 📜
• 🆕 JS: Test Equality of Map Objects 📜
• 🆕 JS: Nested Map

• JS: Set Union, Intersection, Difference 📜
• JS: the Set Object Tutorial
• JS: Xah Functions

• History of the JavaScript script Tag

• JS: Semicolon
• JS: HTML-Like Comment
• JS: ECMAScript 2015
• JS: Function. Declaration vs Expression

• JS: Spread Operator (triple dots)

massive update on JavaScript in past week.

• removed many console.log for short expressions.
• added section visual block for headers.
• rewrote parts of many pages, for more clarity.
• rename, moved, reorg, delete, new, for many sections or pages.

• 🆕 JS: Convert Map to Object 📜
• 🆕 JS: Number
• 🆕 JS: Speed Comparison, Array Push vs Unshift
• 🆕 JS: String is Immutable
• 🆕 JS: String Index
• 🆕 JS: Timing, Benchmark Functions
• 🆕 JS: Speed Comparison of Increment
• 🆕 JS: Speed Comparison of Generating Array

• JS: Array.prototype.includes
• JS: ECMAScript 2015
• JS: Object.defineProperty
• JavaScript Basics
• JS: arguments (object)
• JS: this (binding)
• JS: Keyword var and Global Variable
• JS: Iterate Map Object
• JS: How Map Determines Uniqueness of Keys
• JS: Map (class)
• JS: Number (class)
• JS: Object Tutorial
• JS: Array Push vs Unshift, Speed Comparison
• JS: Strict Mode
• Xah JavaScript Style Guide for Functional Programers
• JS: Timing, Benchmark Functions
• JS: undefined
• JS: Property Overview

• JS: Array.prototype.includes
• JS: Array.prototype.join (to string)
• JS: Array.prototype.length
• JS: Array.prototype.some
• JS: Array.prototype.toString
• JS: Boolean.prototype
• JS: Function.prototype.constructor
• JS: Function.prototype
• JS: Infinity
• JS: Map.prototype.constructor
• JS: Map.prototype.entries
• JS: Map.prototype.size
• JS: Map.prototype[Symbol.toStringTag]
• JS: NaN
• JS: Number.parseFloat (String to Number)
• JS: Number.parseInt (String to Number)
• JS: Number.prototype
• JS: Number.prototype.toString (Number to String)
• JS: Object.defineProperty
• JS: Object.getOwnPropertyDescriptors
• JS: Object.getOwnPropertySymbols
• JS: Object.getPrototypeOf
• JS: Object.is
• JS: Object.isExtensible
• JS: Object.prototype.propertyIsEnumerable
• JS: Object.prototype.valueOf
• JS: Reflect.getPrototypeOf
• JS: Set.prototype.size
• JS: String.prototype.charAt
• JS: String.prototype.charCodeAt
• JS: String.prototype.codePointAt
• JS: String.prototype.concat
• JS: String.prototype.padStart
• JS: String.prototype.repeat
• JS: String.prototype.replace
• JS: String.prototype.replaceAll
• JS: Array
• JS: Array Tutorial
• JS: Array.prototype.every
• JS: Array.prototype.flat
• JS: Array.prototype
• JS: Array (class)
• JS: Arrow Function
• JS: Boolean. true false
• JS: Boolean (class)
• JS: Conditional. if then else
• JS: Deep Copy Array or Object 📜
• JS: Array-Like Object to Array
• JS: Convert String and Number
• JS: Convert Decimal, Binary
• JS: Create Object with Parent X
• JS: Date Constructor
• JS: Date (class)
• JS: Date.prototype
• JS: Global Functions Without Property Key “prototype”
• JS: Factorial 📜
• JS: Get Set Prototype
• JS: for-in Loop 👎
• JS: for-of Loop
• JS: Function Pipe 📜
• JS: Function (class)
• JS DOM: Get URL (window.location)
• JS: isNaN
• JS: Loop. for while do
• JS: JSON (namespace)
• JS: Map Filter 📜
• JS: Map (class)
• JS: Map.prototype
• JS: Swap Key Value of Map 📜
• JS: Sort Map 📜
• JS: Truncate Map 📜
• JS: Map Substract 📜
• JS: Math (namespace)
• JS: Math Operators
• JS: null
• JS: Number Comparison Operators
• JS: Number (class)
• JS: Object Tutorial
• JS: Object (class)
• JS: Object.prototype
• JS: prototype (property)
• JS: Convert Object to Map 📜
• JS: parseInt
• JS: Primitive Value
• JS: Add Method to Prototype
• JS: Array Push vs Unshift, Speed Comparison
• JS: Quote String
• JS: Random Array Element, Randomize Array 📜
• JS: Range Function for Array 📜
• JS: Get Set Property
• JS: Reflect (namespace)
• JS: RegExp.prototype
• JS: RegExp (class)
• JS: Regex Replace Function Args
• JS: Swap Object Key Value 📜
• JS: Set (class)
• JS: Set.prototype
• JS: Split Array 📜
• JS: String Code Unit
• JS: String Constructor
• JS: String Escape Sequence
• JS: String.prototype
• JS: String Operations
• JS: String (class)
• JS: Count Chars in String 📜
• JS: Switch Statement
• JS: Symbol (class)
• JS: Symbol.prototype
• JS: Triple Equal Operator
• JS: typeof Class
• JS: undefined
• JS: Char to UTF-16 Encoding 📜
• JS: Char to UTF-8 Encoding 📜
• JS: Object Type
• JS DOM: Floating Box Following Scroll
• SVG: Circle Arc

• Google Censorship: Image Search White Couple (2018)

• Chinese Websites Encoding survey, Year 2022

• 🆕 JS: Button to Switch to Dark Theme
• CSS: Dark Theme
• Is Dark Theme Good for Your Eyes

• JS DOM: Change CSS

• HTML: Case Sensitivity

minor updates

• JS: RegExp Syntax
• JS: RegExp Flag
• JS: String.prototype.matchAll

complete update

• CSS: Selector Tutorial
• CSS: Selector: Match Tag Name
• CSS: Selector: Match Attribute
• CSS: Selector: Match Parent
• CSS: Selector: Match Sibling
• CSS: Pseudo-Class Selectors
• CSS: Pseudo-Element Selectors
• CSS: Selector Syntax Shortcuts

• CSS: Pseudo Class
• CSS: Pseudo Element

misc update

• CSS: How Large is a CSS Pixel?
• CSS: Fixed Aspect Ratio

• JS DOM: Find Window Size

interesting result.

Github started to require JavaScript

Github, started to require JavaScript, about last month. If no js, the main content no show.

• fuck github, recently started to require js. and is slow.
• by the way, also fuck open source fuckheads. u made things this way.
• yeah move to codeberg or gitlab, until they got big and sold soul like u.
• u r a fuckhead, that continuely make society this way.

JavaScript Async Functions Computation Model

a great article on the JavaScript async functions, an analysis of this computing model.

• JavaScript Books Review 2023