Home > Article > Web Front-end > js gets the code of interline style and current style

js gets the code of interline style and current style

不言Original: 2018-08-20 17:46:101556browse

The content of this article is about the code for obtaining interline style and current style in js. It has certain reference value. Friends in need can refer to it. I hope it will be helpful to you.

Get the interline style style

<!DOCTYPE html>
<html>
<head>
  <title>获取行间样式</title>
  <script>
    window.onload=function(){
      op=document.getElementById("p1");
      alert(op.style.width);
    }
  </script>
</head>
<body>
  <p id="p1" style="width:100px; height:100px; background:#f00;"></p>
</body>
</html>

Get the current style of the element currentStyle(ie) and getComputedStyle(non-ie) compatible methods

<!DOCTYPE html>
<html>
<head>
  <title>获取样式兼容写法</title>
  <script>
    function getStyle(obj,name){
      if(obj.currentStyle){
        return obj.currentStyle[name];
      }else{
        return getComputedStyle(obj)[name];
      }
    }
    window.onload=function(){
      op=document.getElementById("p1");
      // alert(getStyle(op,"width"));
      alert(getStyle(op,"background"));
      // alert(getStyle(op,"backgroundColor"))
    }
  </script>
</head>
<body>
  <p id="p1" style="width:100px; height:100px; background:#f00;"></p>
</body>
</html>

Run results:
js gets the code of interline style and current style
From the running results of the above code, we can see that background returns not #f00 but a composite style, so special treatment is required when encountering composite styles such as background. You can use it here backgroundColor.

Composite style background, border...
Single style width, height, position

Related recommendations:

What is the RegExp object in js? Detailed introduction to the RegExp object in js

Differences and comparisons between test(), exec() and match() of js regular expressions (with examples)

The above is the detailed content of js gets the code of interline style and current style. For more information, please follow other related articles on the PHP Chinese website!

正则表达式 JS regexp 对象 position border background

Statement：

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

Previous article：How to determine whether a shape is convex in js (code)Next article：How to determine whether a shape is convex in js (code)

See more

js gets the code of interline style and current style

Get the interline style style

Get the current style of the element currentStyle(ie) and getComputedStyle(non-ie) compatible methods

Related articles