9

JavaScript を使用して特定の CSS にアクセスする方法がわかりません。

言いましょう、

#menu { color: red; }

でアクセスできます

document.getElementById('menu').style.color = "blue";

でもアクセスしたい

#menu li a { height: 10%; }

document.getElementById() を使用してアクセスするにはどうすればよいですか?

4

2 に答える 2

13

プレーンな JavaScript ソリューション:

getElementById()その目的は id 属性のクエリのみであるため、この場合は使用できませんが、次getElementsByTagName()のコンテキストで使用でき#menuます。

var m = document.getElementById('menu');
// Get all <li> children of #menu
var lis = m.getElementsByTagName('li');
// Loop over them
for (var i=0; i<lis.length; i++) {
  // Get all <a> children of each <li>
  var atags = lis[i].getElementsByTagName('a');
  for (var a = 0; a<atags.length; a++) {
    // And set their color in a loop.
    atags[a].style.color = 'blue';
    // or change some other property
    atags[a].style.height = '25%'; 
  }
}

jQuery ソリューション:

jQuery を使用できる場合、これは非常に簡単になります。

$('#menu li a').css('color', 'blue');
于 2012-07-26T23:55:54.023 に答える
2

あなたはそうしない; <a>その条件に一致するすべてのタグを見つける必要があります。

.getElementById()関数は、一意の「id」文字列によって要素を取得することです。それ以外の場合に要素を取得する必要がある場合は、他の API を使用できます: .getElementsByTagName()、.getElementsByClass()、.querySelectorAll()など。ブラウザのサポートはさまざまであり、.getElementById()IE と他のブラウザの間でも異なります。

于 2012-07-26T23:54:09.327 に答える