JavaScriptがHTMLスタイルを変更しない

ボタンをクリックして自分の名前の色を変更しようとしています。ここまで私が今まで行ってきたことは、JavaScriptがHTMLスタイルを変更しない

<html> 
<head><title></title></head> 
<body> 
<p id="demo">Sandeep Roy</p> 
<button type="button" onclick="change()">Click</button> 
<script> 
function change() { 
var x=document.getElementById("demo"); 
x.style.color=red; 
} 
</script> 
</body> 
</html>

「クリック」ボタンをクリックすると、予想される出力が赤色のフォントになります。

残念ながら、私はそれを行うと何も起こりません。つまり、同じ黒色のフォントです。この件について教えてください。以下、あなたが不足しているクォータ

var x=document.getElementById("demo"); 
x.style.color=red;

で

出典

2016-07-29 Sandeep Roy

あなたを助けた答えを受け入れることを忘れないでください。 –

は、そのほかに

var x=document.getElementById("demo"); 
x.style.color='red';

でなければなりません - このアプローチはひどいです。クラスの切り替えがより好ましい

出典

2016-07-29 07:26:20

＆あなたの時間を教えていただきありがとうございます。 JavaScriptの初心者のための良い本をお手伝いください。 –

これを試してみてください：http://shop.oreilly.com/product/9780596517748.do - それはスタートのために最高だと思います。 –

もう一度ありがとう、お元気です。 –

この場合、redは可変です。代わりに文字列を使用する必要があります。使用

x.style.color='red';

出典

2016-07-29 07:26:29

以下の行には見出しがありません。

x.style.color='red';

出典

2016-07-29 07:30:04 James

お時間をありがとう。 –

構文ミス

x.style.color='red';

出典

2016-07-29 07:32:21

正しい -赤色カラーの文字列名または値（ '＃FF0000の' のような六角カラーコード）として割り当てます。

Syntax- object.style.color="color|initial|inherit" 

x.style.color='red'; 
x.style.color='#ff0000';

あなたは、それが動作これを試してみてくださいFiddler

<html> 
 
<head><title></title></head> 
 
<body> 
 
<p id="demo">Sandeep Roy</p> 
 
<button type="button" onclick="change()">Click</button> 
 
<script> 
 
function change() { 
 
var x=document.getElementById("demo"); 
 
x.style.color='red'; 
 
} 
 
</script> 
 
</body> 
 
</html>

出典

2016-07-29 09:29:05

教育に感謝します。 –

でライブデモを見ることができます

<html> 
 
<head><title></title></head> 
 
<body> 
 
<p id="demo">Sandeep Roy</p> 
 
<button type="button" onclick="change()">Click</button> 
 
<script> 
 
function change() { 
 
    document.getElementById("demo").style.color = "red"; 
 
} 
 
</script> 
 
</body> 
 
</html>

出典

2016-07-29 09:31:30

@Himanshu Sharmaはid変数を変数に代入し、そのスタイルを変更しましたが、変数名を付けずに変更しようとしました。 –

このアプローチはよりコンパクトに見える、私は変数を割り当てる必要はありませんし、他の手順に従ってください。今、単に私がしたい変更を直接割り当てることができます。教育に感謝します。本当に感謝しております。 –

JavaScriptがHTMLスタイルを変更しない

答えて

関連する問題