JavaScript/jQueryにてStyle文字列を取得したい。

下記ソースにて、Styleを<a>タグへ設定して状態の確認を行っています。
htmlでの表示は正常に反映されています。
ここで設定した文字列を$('#ptes0')、及びdocument.getElementById('ptes0')で
取得したオブジェクトから表示をしたいと思いますが上手くいきません。
Console表示されたい文字列は下記となります
'color:chocolate !important'
'font-size:30px'
'height:500px'
教えて頂きたく宜しくお願い致します。

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<HTML>
<HEAD>
</HEAD>
<script src="https://code.jquery.com/jquery-3.4.1.min.js"></script>
<BODY>
<a id="ptes0">ptes0 </a>
<SCRIPT>
	"use strict";
	$(function($){
		$('#ptes0').css({
			'cssText':'color:chocolate !important',
            'font-size':'30px',
            'height':'500px',
		});
	});

	var target = $('#ptes0');
        //色々と試した内容
	console.log(target);
	console.log(target.css('color'));
	console.log(target.css('height'));
	console.log(target.css('font-size'));

	var work = document.getElementById('ptes0');
        //色々と試した内容
	console.log(work);
	console.log(work.style);
	console.log(work.style.cssText);
</SCRIPT>

行動規範の内容に同意します

回答1件

ベストアンサー

.attr('style')とすれば、style属性の文字列がそのまま取れます。あとは、セミコロンで区切るなどして、文字列処理すれば目的のものを取れるかと思います。

投稿2020/05/28 01:41

maisumakun

総合スコア146018

tosi

2020/05/28 02:31 編集

~~有難う御座います。取得できました。~~ $(function(){})の外側に書くことで取得できました。 document.getElementById('ptes0');側からの取得方法はご存じないでしょうか。console.log(work.style.cssText);で空白しか出ないのが不思議に思っています。