current position:Home>JS, HTML and CSS are not compatible and do not use common knowledge
JS, HTML and CSS are not compatible and do not use common knowledge
2022-05-15 02:13:04【Maple moving forward】
1.startsWith() Not at all ie
Used to detect whether a string starts with a specified substring .
grammar :string.startsWith(searchvalue, start)
2.Proxy Not at all ie
Object is used to define the custom behavior of the basic operation ( Such as attribute search 、 assignment 、 enumeration 、 Function calls, etc ).
3.Reflect Not at all ie and firefox
Is a built-in object , It provides interception JavaScript How to operate . These methods and proxy The same way .Reflect
It's not a function object , So it's not constructable .Reflect
All properties and methods of are static ( It's like Math object )
4.css function
min() Not at all ie、Opera Mobile、Firefox for Android, And OS Safari Support only 11.3 And above
Select a minimum value from the comma separator expression as CSS The attribute value .min() Method can be used in any of the following properties <length>, <frequency>, <angle>, <time>, <percentage>,<number>, perhaps <integer>.
width: min(1vw, 4em, 80px);
It allows us to set the maximum size of responsive components , It is easier to set the maximum width of the image .
min() Not at all ie、Opera Mobile、Firefox for Android, And OS Safari Support only 11.3 And above
The effect is the same
clamp()
Not at all ie、Opera Mobile、Firefox for Android, And OS Safari Support only 11.3 And above
clamp() The function limits a value between an upper limit and a lower limit , When this value exceeds the range of minimum and maximum , Choose a value between the minimum value and the maximum value to use . It takes three parameters : minimum value 、 Preferred value 、 Maximum . clamp() Used in <length>、<frequency>、<angle>、<time>、<percentage>、<number>、<integer> It's all allowed in . clamp(MIN, VAL, MAX) In fact, it means max(MIN, min(VAL, MAX))
font-size: clamp(1rem, 10vw, 2rem);
5. Encoding and decoding base64 character string
stay JavaScript in , There are two functions used to deal with decoding and encoding base64 character string :
atob()
Function can be decoded through base-64 Encoded string data . By contraries ,btoa()
The function can extract data from binary data “ character string ” Create a base-64 Coded ASCII character string .
6.symbol
symbol It's a basic data type (primitive data type).Symbol()
Function will return symbol Type value , This type has static properties and static methods . Its static properties expose several built-in member objects ; Its static methods expose the whole situation symbol register , And it's similar to a built-in object class , But it's not complete as a constructor , Because it doesn't support grammar :"new Symbol()
".
Each from Symbol()
Back to symbol Value is the only . One symbol Values can be used as identifiers for object properties ; This is the only purpose of this data type .
grammar :Symbol([description])
description yes
Optional , String type . Yes symbol Description of , Can be used for debugging but not for accessing symbol In itself .
Use it directly Symbol()
Create a new symbol type , And use an optional string as its description .
var sym1 = Symbol();
var sym2 = Symbol('foo');
var sym3 = Symbol('foo');
Symbol("foo") === Symbol("foo"); // false
Simulation Implementation call、apply Function can be used symbol
7.Object.freeze(obj) Full support
Object.freeze()
Methods can be frozen An object . A frozen object can no longer be modified ; You cannot add new properties to an object when it is frozen , Cannot delete an existing property , Enumerability of existing properties of this object cannot be modified 、 Configurability 、 writability , And the value of an existing property cannot be modified . Besides , When an object is frozen, its prototype cannot be modified .freeze()
Returns the same object as the passed in parameter .
const obj = {
prop: 42
};
Object.freeze(obj);
obj.prop = 33; // Throws an error in strict mode
console.log(obj.prop); // 42
8.Reflect Not at all ie
Reflect.deleteProperty(target,propertyKey)
Reflect.deleteProperty
Allows you to delete attributes on an object . Return to one Boolean Value indicates whether the attribute was successfully deleted . It's almost with non strict delete operator identical
9.padStart() Not at all ie
padStart()
Method to fill the current string with another string ( If necessary , Will repeat many times ), So that the resulting string reaches the given length . Fills from the left side of the current string .
const str1 = '5';
console.log(str1.padStart(2, '0'));
// "05" Apparent date 、 It's convenient to fill in zeros in time
copyright notice
author[Maple moving forward],Please bring the original link to reprint, thank you.
https://en.qdmana.com/2022/132/202205120524480615.html
The sidebar is recommended
- Educoder web programming foundation autumn 2021 - HTML5 - text control class label
- Educoder web programming foundation autumn 2021 - HTML5 document header tags and attributes
- Educoder web programming foundation autumn 2021 - HTML5 - text control class label
- Educoder web programming foundation autumn 2021 - overview of web front end development
- Vue data broker
- HTML5 notes - new specifications and new elements
- Lunch break train & problem thinking: on multidimensional array statistics of the number of elements
- Children's Painting Tutorial | children's interesting art lesson "firecrackers say goodbye to the old year and fireworks greet the new year"
- LeetCode 713. Subarray with product less than k
- JavaScript programming training Day6
guess what you like
Vue realizes two-level linkage
Tengine uses brotli to turn on tls1 3 and optimize HTTPS access speed
C + +: remove the specified element from the array
C + +: main elements
Learn about nginx and tomact
IC workplace Theory -- feelings of senior brother of digital ic front-end design after 4 months of employment (Part I)
Vue Chapter 3 scaffolding's most complete render function, props, mixin mixing, plug-ins, browser local storage, component customization events_ Binding, unbinding, global event bus, message subscription and publishing, nexttick, Vue transition and animat
Vue Chapter 5 vuex creates and introduces the use of store, getters and four map methods
***************2、 JS + Vue js***************
A detailed explanation of HTTP protocol + classic interview questions
Random recommended
- Vue Chapter 4 Ajax in Vue: cross domain problems and slot slots
- Online nginx does not support the bug record of error reporting in delete request
- Okhttp sets the public parameters and puts the JSON object into the @ body to request the configuration of the public parameters
- Fluent ignores authentication of HTTPS and WSS certificates
- Browser loading HTML page evokes the most complete strategy of APP in mobile phone
- HTTP status code 304 and Etag details
- Using angularjs for fuzzy dynamic search drop-down box content
- Seamless connection to Macao, Hengqin Island, which is beautiful beyond the sky, is on fire again
- JQuery framework
- Vue mouse down and move event
- A simple Vue answer demo, single choice and multiple choice
- Front end interview question: if the cell in the table is red, click it to turn into white; if it is white, click it to turn into red, and what is not clicked is white
- Vue packaging folding panel plus animation effect
- If the front-end does real-time data acquisition?
- Ant vue3 table sorted by time
- Vue local refresh iframe
- Vue instruction authority
- Vue iframe refresh remains on the original page
- Vue realizes Gaode map API mask, positioning and weather
- Comparison and implementation of bidirectional data binding between react and Vue
- React error report record
- Analysis of react life cycle function
- react demo1 TodoList
- Summary of the differences between state and props in react
- Difference between controlled components and uncontrolled components in react
- Node. JS use get Stream download file
- How does JavaScript copy arrays instead of references
- JavaScript calculates the number of days, hours, minutes and seconds between days
- JQuery get page address parameters
- JavaScript create Download
- node. JS traversal directory
- Tips for using JavaScript string split (how to keep the delimiter)
- Common CSS notes
- JavaScript usage Get the address of the regular function
- New generation node JS web development framework koa zero foundation entry learning notes
- JavaScript notes
- asp. Net core method for modifying HTML without rerun
- Summary of compatibility processing of H5 + Vue cli project in Safari browser
- Summary of amap scheme of Gaode map used in vue3 + TS project
- Summary of filter scheme used in JS code in Vue