井井客

搜索

JS获取CSS外部样式地址

通过link标签引用.css的样式文件我们叫做CSS外部样式,如何使用JS获取CSS外部样式地址,其实也比较简单。

JS获取CSS外部样式地址

页面中只引用了一个CSS外部样式,可以通过下面的代码来获取CSS外部样式地址:

<html>
<head>
<title>JS获取CSS外部样式地址(单个样式)</title>
<link rel="stylesheet" type="text/css" href="http://www.jingjingke.com/res/css/style.css"/>
</head>
<body>
<script>
var links = document.getElementsByTagName('link');
var ahref = '';
for(var i = 0; i < links.length; i++){
	if(links[i].rel === 'stylesheet'){
		ahref = links[i].href;
		break;
	}
}
alert(ahref);
</script>
</body>
</html>

代码结构还是比较清楚的,意思应该不用特别多说。使用循环而不是直接使用document.getElementsByTagName('link')[0]是因为担心后期可能外部样式语句前面会加上其它的link语句,如网站icon等。

而当页面中不止引用一个CSS外部样式时,则可以使用下面的代码来获取多个CSS外部样式地址:

<html>
<head>
<title>JS获取CSS外部样式地址(多个样式)</title>
<link rel="stylesheet" type="text/css" href="http://www.jingjingke.com/res/css/style01.css"/>
<link rel="stylesheet" type="text/css" href="http://www.jingjingke.com/res/css/style02.css"/>
</head>
<body>
<script>
var links = document.getElementsByTagName('link');
var ahref = [];
var arrayNum = 0;
for(var i = 0; i < links.length; i++){
	if(links[i].rel === 'stylesheet'){
		ahref[arrayNum] = links[i].href;
		arrayNum ++;
	}
}
alert(ahref);
</script>
</body>
</html>

对比一下获取单个CSS外部样式地址的方法,是不是都挺简单的~

文章TAG:js

作者:井井客原创来源:原创
本文标题:JS获取CSS外部样式地址
本文链接:/c/2381.html

上一篇:margin-top无效的解决办法
下一篇:验证输入框中的值是否为初始值

文章分类

相关阅读

随便看看