ホームページ > 記事 > ウェブフロントエンド > 可変パラメータCSS関数を使用して非インターラインスタイルを取得する方法
可変パラメータCSS関数を使用して非インターラインスタイルを取得する方法
- 小云云オリジナル
- 2018-03-14 16:48:581398ブラウズ
この記事では主に可変パラメータCSS関数を使用して非インターラインスタイルを取得する方法を紹介します。お役に立てれば幸いです。
1. 変数パラメータ
<!DOCTYPE html><html>
<head>
<meta charset="UTF-8">
<title>可变参数</title>
</head>
<script>
window.onload= function(){
function sum1(){
var sum=0; for(var i=0;i<arguments.length;i++){
sum+=arguments[i];
} return sum;
}
alert(sum1(1,2,3,4,5,6,7));
} </script>
<body>
</body></html>2. CSS関数
<!DOCTYPE html><html>
<head>
<meta charset="UTF-8">
<title>css函数</title>
<script>
window.onload=function(){
//css1()和css2()是两个函数，但是功能是相同的。为了防止arguments出现太多容易混乱。所以给他们起一个名字
function css1(){
if(arguments.length==2){ //记得填写return，这样外部才能接收
return arguments[0].style[arguments[1]];
}else{ arguments[0].style[arguments[1]]=arguments[2];
}
} function css2(obj,name,value){
if(arguments.length==2){ //记得填写return，这样外部才能接收
return obj.style[name];
}else{
obj.style[name]=value;
}
} var op = document.getElementById('op');
alert(css2(op,'width')); //里面使用的是字符串
css2(op,'background','green');
} </script>
</head>
<body>
<p id='op' style="width: 100px;height: 100px;background: red;">
</p>
</body></html>3. 非インターラインスタイルを取得する
window.onload()を使用する場合、他の関数を呼び出すことはできます。
非インターラインスタイルを取得するには 2 つの方法があります。
まず、currentStyle の使用方法は style と同じですが、IE とのみ互換性があります。
次に、getComputedStyle の使用方法は getComputedStyle(op, false).width です。ここで、最初のパラメータはオブジェクトの名前です。 2番目のパラメータは任意の値です。
インターライン スタイルを取得する場合、getComputedStyle を使用して背景などの複合スタイルを取得することはできませんが、背景色を取得したい場合は、backgroundcolor を使用できます
<!DOCTYPE html><html>
<head>
<meta charset="UTF-8">
<title>获取非行间样式</title>
<style>
#p1{width: 300px; height: 200px; background: red;}
</style>
<script>
window.onload=function(){
huoqu();
} function huoqu(){
var op = document.getElementById('p1'); if(op.currentStyle){
alert(op.currentStyle.width);
}else{
alert(getComputedStyle(op,false).width);
}
} </script>
</head>
<body>
<p id='p1'>
</p>
</body> </html>関連する推奨事項:
非インターライン スタイルを取得するには? js と jquery を使用して非インターライン スタイルを取得します
JS で非インターライン スタイルを取得し、互換性の問題_html/css_WEB-ITnose
CSS 非インターライン スタイルの使用については、解決してください~_html/css_WEB-ITnose
以上が可変パラメータCSS関数を使用して非インターラインスタイルを取得する方法の詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。