前端内容简单记录

JS文件读取HTML页面的信息

html的head标签

<script type-text/javascript">
window.webHost='<trs_website field="WEBHTTP" />';
console.log('当前站点='，webHost);
</script>

js文件直接使用

console.log("js站点",webHost);

绝对路径&相对路径

绝对路径(完整路径,复制过来直接可打开)

相对路径(相对某个目录下的路径)["、/"代表当前目录,"…/"代表上级目录;"/"代表根目录j(./xx.png]
通过SSI方式引入的文件，里面引用的js/css文件使用绝对路径

英文内容不换行

英文内容若是全部为字母，系统会默认为一个单词，于是不会换行，导致div块的区域内容直接超出div的范围，此时需要补充css样式

word-break:break-all;

中文内容过长时，只显示两行，多余部分省略号显示

text-overflow:ellipsis;
overflow:hidden;
display:-webkit-box;
-webkit-line-clamp:2;  /* 控制显示2行 */
-webkit-box-orient:vertical;

nth-of-type()获取第几个元素

<ul>
	<li>第一个</li>
	<li>第二个</li>
	<li>第三个</li>
	<li>第四个</li>
	<li>第五个</li>
</ul>

ul li:nth-of-type() 表示遍历ul标签下的所有子元素li，后根据规则获取对应的子元素li

• nth-of-type(n+2)表示ul标签下的 从第二行到末尾的子元素li标签
• nth-of-type(-n+2)表示ul标签下的 从开始到第二行的子元素li标签
• nth-of-type(n)表示ul标签下的第n个子元素li标签
• nth-of-type(3n)表示ul标签下的 每三个元素中的第一个子元素li标签
• nth-of-type(3n+1)表示ul标签下的 每三个元素中的第二个子元素li标签

!important强制生效

<div class="content">
	<span style="color: red">我是一段文字，想要变成黑色字体！</span>
</div>

读取的内容是富文本，而富文本中对字体颜色进行了设置，由于开发需求，需要设置为黑色

此时需要自己设置的样式强制生效

.content span{
    color: black !important; 
}