Community Learn Tools Library Leisure
search
English
Home > Web Front-end > JS Tutorial > body text

Some experience recommendations_javascript skills

WBOY
Release： 2016-05-16 19:26:47
Original
777 people have browsed it

The following are the problems and experiences I encountered during development. I spent some time debugging and posted them to avoid detours. If there are any mistakes, please correct me and continue to update.
Try to encode xml files in utf-8, gb2312 some Words cannot be stored, such as ©. Even if they can be stored, they still need to be converted, which is troublesome. UTF-8 also complies with international standards.
The :hover pseudo-class in CSS will be invalid if it is placed in front of:visited
If the tag does not have the href attribute, all its CSS pseudo-classes such as:hover will be invalid.
In the js file, references in the form of document.wirte("<script>" "script>" are used, and their file relative paths are all <br><br> For example, if a.htm refers to xb.js and b.js refers to xc.js, the file should be xc.js instead of the direct path c relative to b.js. js, but the @import, url() reference in css does not have this problem <br><br>In the page, sometimes the width of the talbe is set to 100%, which will leave a blank space for the scroll bar on the right, please set it <body style="overflow:auto"> <BR>For commonly used images, do not use img tags. Use <span><a> and use CSS to specify the background, width and height. For dynamic images (move up to change the background), it is best to use <a>, no additional When writing code, just use the pseudo-class:hover. The advantage of using css is that you can change everything at once. This can be well used in skin-changing applications. <BR>@font-face { <BR>font-family: comic; <BR>src:url(http://valid_url/some_font_file.eot); <BR>} <BR>Define a font name that is not available locally, call <span style="font-family:comic;font-size:18pt>aa <BR> several CSS <BR>div { overflow: hidden; text-overflow:ellipsis; } <BR>td { vertical-align : middle; } <BR>To force overflow to occur and apply the ellipsis value, the author must set the object's white-space property The value is nowrap . If there is no opportunity for line wrapping (for example, the width of the object container is narrow, and there is a long text without reasonable line breaks), it is possible to overflow without using nowrap in order to make the ellipsis value. For applications, this property must be set to an object with an invisible area. The best option is to set the overflow property to hidden <BR> Firefox's document.createElement does not support HTML tags in the content, nor does it support innerText, but supports innerHTML. You can use innerHTML to specify its content. <BR>The width of the DropDownList in the .net control is not colored under firefox. You need to directly define style='width:10px;' <BR>The CSS cursor in firefox does not support hand, use pointer instead. <BR>The scroll bar in the iframe needs to set style='overflow:hidden' in the iframe tag. It cannot be set only in the body. There will be problems in firefox. <BR>In the onpropertychange event, pay attention to using event.propertyName to filter the property change event. , when setting this event, the onpropertychange attribute has actually been changed, so it will be executed automatically. <BR>The support version for XSL in js5.6 is lower, such as the document function is not supported. <BR>The slice function is more direct than Looping to obtain array fragments is slow <BR>When nextSibling obtains the next object, please note that there should be no spaces between the two nodes, otherwise it is easy to fail to obtain the correct object. <BR>CreateTextFile must specify the third parameter when there is Chinese. true, otherwise Chinese cannot be written, and the performance is an error when writing. <BR>Use ADODB.stream when saving Chinese text, do not use fso, because FSO does not support utf-8 format <BR><BR>2. Anchor pseudo-class <BR> <STRONG>The most commonly used ones we use are the four pseudo-classes of a (anchor) elements, which represent the four different states of dynamic links: link, visited, active, hover (unvisited link, visited link , activate the link and mouse over the link). We define different effects for them respectively: a:link{color:#FF0000;text-decoration:none}/*Unvisited link*/ <BR>a:visited{color:#00FF00;text-decoration :none}/*Visited link*/ <BR>a:hover{color:#FF00FF;text-decoration:underline}/*Mouse over link*/ <BR>a:active{color:#0000FF;text -decoration:underline}/*Activate link*/ <BR> (In the above example, the color of the link is red and underlined when it is not accessed, it is green and underlined when it is accessed, and it is blue and underlined when the link is activated. , it is purple and underlined when the mouse is on the link) <BR>Note: Sometimes it has an effect when the mouse points to the link before the link is accessed, but it has no effect when the mouse points to the link again after the link is accessed. This is because you put a:hover in front of a:visited. In this case, because the latter one has a higher priority, the effect of a:hover will be ignored when the link is accessed. Therefore, according to the stacking order, when we define these link styles, we must write them in the order of a:link, a:visited, a:hover, and a:actived.</script>

Related labels：
recommend
source：php.cn
Previous article：Let the text rotate 90 degrees and 180 degrees on the page_Typical special effects Next article：News scroll up effect for a period of time
Statement of this Website
The content of this article is voluntarily contributed by netizens, and the copyright belongs to the original author. This site does not assume corresponding legal responsibility. If you find any content suspected of plagiarism or infringement, please contact admin@php.cn
Latest Articles by Author
Latest Issues
Status update not working in React-Native on Android I have some code that has pairs of images in a swipeable horizontal gallery. Now when you ...
From 2024-04-06 16:54:10
0
1
410
How do I tune these cards to respond with Boostrap 4? How can I make each row display 4 cards, and of course make them stack if the screen size ...
From 2024-04-05 10:48:45
0
1
4072
Tried everything but still the HTML content is not showing Basically, the content of the html document won't display anything on the browser. This HT...
From 2024-04-04 19:16:15
0
1
3496
Add additional values ​​to displayed format data fields using javascript I'm trying to achieve this: I want to create a form that collects data entered by the user...
From 2024-04-04 15:17:13
0
1
3589
Content overflow in window prevents scrolling and hides new content I'm currently building a roulette system program (this is more to stop me from placing bet...
From 2024-04-03 21:24:55
0
1
285
Related Topics
More>
Popular Recommendations
Popular Tutorials
More>
Related Tutorials
Popular Recommendations
Latest courses
Latest Downloads
More>
Web Effects
Website Source Code
Website Materials
Front End Template