5

次の方法で投稿されたユーザー名を取得するには、JavaScript を使用する必要があります。

<div id="project_user">
    <p class="project_user">
        by <span class="project_username"><?php echo $OwnerName; ?></span>
     </p>
</div>

どうすればいいのですか?

次のことを試しましたが、うまくいきませんでした:

document.getElementById('project_username').innerHTML
4

4 に答える 4

9

次の方法で選択idする必要があるときに選択しますclassName

document.getElementsByClassName('project_username')[0].innerHTML

ライブデモ

document.getElementsByClassName古いIEバージョンでは実装されていないことに注意してください...


別の方法:

document.getElementById('project_user')
        .getElementsByTagName('span')[0].innerHTML;

ライブデモ


この「パッチ」を使用して、古いブラウザーでこの関数を定義できます。

if (!document.getElementsByClassName) {
    document.getElementsByClassName = function(classname) {
        var elArray = [];
        var tmp = document.getElementsByTagName("*");
        var regex = new RegExp("(^|\\s)" + classname + "(\\s|$)");
        for (var i = 0; i < tmp.length; i++) {
            if (regex.test(tmp[i].className))
                elArray.push(tmp[i]);
        }

        return elArray;
    };
}​

ソース


jQueryまたは、 (ほぼ) すべての CSS セレクターを実装するような JavaScript ライブラリを使用します。例:

$('.project_username').html();
于 2012-05-20T18:11:20.063 に答える
1

どのブラウザがどのメソッドをサポートしていますか?

document.getElementById要素に がある場合にのみ機能しますid='targetvalue'。上記の例は、値がclassではなく属性にあることを示していますid

を使用できますgetElementsByClassNameが、これは IE8 以前ではサポートされていません。document.querySelectorAllIE でのサポートがわずかに優れているもあります。

うーん、ブラウザのサポート - チャートはきれいです

http://www.quirksmode.org/dom/w3c_core.html#gettingelementsで、要素をオンラインで取得するさまざまな方法に対するブラウザのサポートを確認できます。

一人でやる冗長さ

広範なクロスブラウザー互換のソリューションを作成すると、冗長になる可能性があります。

var parent = document.getElementById("project_user"),
    element;

// If the browser supports querySelectorAll, use it.
if ( parent.querySelectorAll ) {
  element = parent.querySelectorAll('.project_username')[0];

// Else, if getElementsByClassName is supported, use it.
} else if ( parent.getElementsByClassName ) {
  element = parent.getElementsByClassName('project_username')[0];

// Else, roll up our sleeves, let's do this the hard way
} else {
  var spans = parent.getElementsByTagName("span"), 
      spani = spans.length;
  while ( spani-- ) {
    if ( spans[spani].className === "project_username" ) {
      element = spans[spani];
      break;
    }
  }
}

優れたツールを使用することの簡潔さ

または、フラストレーションを軽減するために jQuery のようなものを使用することもできます。

var $element = $(".project_username");
于 2012-05-20T18:11:01.197 に答える
0

document.getElementsByClassName()IE 8 がサポートしていないようにクロス ブラウザー互換性はありません。サポートされていない場合は、独自のgetElementsByClassName()を記述する必要がある場合があります。

代替案は次のとおりです。

var projUser = document.getElementById('project_user');
var projUsername = projUser.getElementsByTagName('span')[0]; // If you need 1st span's content
var userame = projUsername.innerHTML;

1行で書くこともできます。

var userame = document.getElementById('project_user').getElementsByTagName('span')[0].innerHTML;
于 2012-05-20T18:47:06.567 に答える
0

試す:

var project_username = document.getElementById('project_user').getElementsByClassName('project_username')[0].innerHTML;
alert(project_username);

または jQuery を使用すると、はるかに簡単になります。

var project_username = $('.project_username');
alert(project_username);
于 2012-05-20T18:15:09.743 に答える