4

さて、私はこのウェブサイトを構築してきました。ページの1つは、ニュースフィードwww.wenotelling.x10.mx/news/です。ニュースページには、実際の更新が行われるニュースフィードページが埋め込まれています。これらはすべて非常にうまく機能しており、そのWebページは機能しているようです。私は2つの問題を抱えていました。

  1. ニュースフィードは、ページが読み込まれたときに更新されていないようですが、ページが更新されたときに読み込まれます。
  2. スマイリーを追加したかった。

そこで、これらの問題の両方を一度に修正するために、いくつかのJScriptを作成しました。ニュースフィードはHTMLページで更新され、毎回スマイリーのURLを探す必要がなかったため、次のコードを思いつきました。http: //www.wenotelling.x10.mx/news/smilescript .js

$(document).ready(function() 
{
    alert("Called");
    document.getElementByClass('happy').innerHTML = '<img src="smileys/happy.gif"></img>';
    document.getElementByClass('star').innerHTML = '<img src="smileys/star.gif"></img>';
    document.getElementByClass('dead').innerHTML = '<img src="smileys/dead.gif"></img>';
    document.getElementByClass('yawn').innerHTML = '<img src="smileys/yawn.gif"></img>';
    document.getElementByClass('snub').innerHTML = '<img src="smileys/snub.gif"></img>';
    document.getElementByClass('relax').innerHTML = '<img src="smileys/relax.gif"></img>';
    document.getElementByClass('devil').innerHTML = '<img src="smileys/devil.gif"></img>';
    document.getElementByClass('cool').innerHTML = '<img src="smileys/cool.gif"></img>';
    document.getElementByClass('wink').innerHTML = '<img src="smileys/wink.gif"></img>';
    document.getElementByClass('shock').innerHTML = '<img src="smileys/shock.gif"></img>';
    document.getElementByClass('bigsmile').innerHTML = '<img src="smileys/bigsmile.gif"></img>';
    document.getElementByClass('confused').innerHTML = '<img src="smileys/confused.gif"></img>';
    document.getElementByClass('sad').innerHTML = '<img src="smileys/sad.gif"></img>';
    document.getElementByClass('angry').innerHTML = '<img src="smileys/angry.gif"></img>';
    document.getElementByClass('clown').innerHTML = '<img src="smileys/clown.gif"></img>';
    document.getElementByClass('blush').innerHTML = '<img src="smileys/blush.gif"></img>';
    if(location.hash !="#");
    {
        location = "#";
        location.reload(true);
    }
    alert("A-OK");
});

したがって、編集するときは、単純にを置くことができます<smiley class="happy"></smiley>。スマイリーが本物のタグではないことは知っていますが、以前に「偽のタグ」を見たことがあるので、それが違いを生むとは思いませんでした。スマイリータグをに変更してみまし<div class="happy"></div>たが、それもうまくいきませんでした。スクリプトの最後に、更新機能を追加しました。

とにかく、スクリプトは機能していませんでした。呼び出されていますが、機能していません。だから私はFirebugを実行しました。Firebugは次のメッセージを出しました：

SyntaxError: missing ) after argument list
[Break On This Error]   
(22 out of range 21)

次に、スクリプトを確認しましたが、すべての）がそこにあるようです。それだけでなく、22行目より前のスマイリーも機能していません。

いずれかの方法。理由は何ですか：1）スマイリーが表示されていませんか？2）スクリプトが完全に実行されていませんか？

4

3 に答える 3

5

javascriptエラーは少し誤解を招くことがありますが、少なくとも1つの構文エラーがコードで見つかる可能性があります。

 if(location.hash !="#");{

余分ながあり;ます。多分それが理由です。

ところで、とにかくjQueryを使用しているので、要素の選択とhtmlコンテンツの設定にjQueryを使用してみませんか？

于 2012-12-22T14:21:50.827 に答える
5

リンクしたスクリプトの19行目：

if(location.hash !="#");{

そのセミコロンはそこにあるべきではありません。（ところで、ifブロック内の行はインデントする必要があります）

document.getElementsByClassさらに、、だけのようなものはdocument.getElementsByClassNameなく、単一の要素ではなくNodeListを返します（したがって、それを変更してinnerHTMLもあまり効果はありません）。

その他の注意事項：

  • Webサイトには、css/stylesheet.css2回（行＃4と＃12）が含まれており、iframe内の1つを数えると、実際には3回含まれています。

  • 使用しているjqueryのバージョンは非常に古く、この場合、jqueryを含めることはほとんど正当化されません。$(document).readyこれは、（セミクローズ）window.onloadリスナーをエーテルスティックする場合にjqueryなしで実行できるために使用しているだけです。 、またはスクリプトを</body>

  • コメントで述べたように、そして私はこれ以上同意できませんでしたが、それらの要素の中に画像を貼り付けるだけではいけません。適切なCSSクラスを追加し、CSSに処理させます。

于 2012-12-22T14:22:57.433 に答える
0

すぐに修正する必要があるいくつかのことは、存在しないメソッドへの呼び出しと、迷子のセミコロンです。getElementByClass1 つ目は、複数形ではなく単数形の への呼び出しです。次に、セミコロンの位置がずれています: if(location.hash !="#");.

jQuery を使用しているのでgetElementsByClass、一部の古いブラウザには存在しないネイティブ メソッドのようなものは避けることをお勧めします。代わりに、次のようにしてみてください。

var emoticons = ["happy","star","dead","yawn"];

$(document).ready(function () {
    $.each(emoticons, function (index, value) {
        $("<img>", {src: "smileys/" + value + ".gif"}).appendTo("." + value);
    });
});​

ここで、絵文字ごとに何度も繰り返さないことに注意してください。スプライトは一般的に、このような問題の解決策としてはるかに優れているため、スプライトを調べることをお勧めします。しかし、それは別の日のことです。

デモ: http://jsfiddle.net/yRSF9/

于 2012-12-22T14:49:41.513 に答える