プログラミング dom

8

このjQueryコード（レスポンシブメニューセクションで使用）を純粋なJavaScriptに変換する方法を探しています。実装が難しい場合は、他のJavaScriptフレームワークを使用してもかまいません。 $('.btn-navbar').click(function() { $('.container-fluid:first').toggleClass('menu-hidden'); $('#menu').toggleClass('hidden-phone'); if (typeof masonryGallery != 'undefined') masonryGallery(); });

126 javascript dom toggle

6

innerText vs innerHTML vs label vs text vs textContent vs outerText

JavaScriptが入力されたドロップダウンリストがあります。負荷時に表示するデフォルト値を決定する際、次のプロパティはまったく同じ値を示すことに気付きました。 innerText innerHtml label text textContent outerText 私自身の調査では、ベンチマークテストまたはそれらのいくつかの間の比較を示していますが、すべてではありません。私は自分の常識を使用して、同じ結果を提供するのでどちらか一方を選択できますが、データが変更された場合、これは良い考えではないのではないかと心配しています。私の発見は： innerText 値をそのまま表示し、含まれている可能性のあるHTML形式を無視します innerHTML 値を表示し、HTMLフォーマットを適用します labelと同じようinnerTextに見えるので、違いがわかりません textinnerTextjQuery省略バージョンと同じように見えますが textContentと同じように見えますが、innerTextフォーマットを維持します（など\n） outerText と同じように見える innerText 私の研究は私の研究が正しければ、何の特別な約がある場合にも、これまでのところ私は私が考えるか公開されているものを読むことができるものをテストすることができるよういずれかの確認を私にすることができます取ることができますlabelとouterText？

124 javascript html dom

5

クラス名によるDOM要素の取得

私はPHP DOMを使用しており、DOMノード内の指定されたクラス名を持つ要素を取得しようとしています。そのサブ要素を取得する最良の方法は何ですか？更新：私はMechanizePHPを使用することになりました。

124 php css dom

6

jQueryの幅、innerWidthとouterWidth、高さ、innerHeightとouterHeightの違いは何ですか

違いを確認するためにいくつかの例を書きましたが、幅と高さの結果は同じです。 <html> <head> <script type="text/javascript" src="jquery.js"></script> <script type="text/javascript"> $(document).ready(function(){ var div = $('.test'); var width = div.width(); // 200 px var innerWidth = div.innerWidth(); // 200px var outerWidth = div.outerWidth(); // 200px var height = div.height(); // 150 px var innerHeight = div.innerHeight(); // 150 px var outerHeight = div.outerHeight(); …

124 javascript jquery css dom styles

11

子ノードのインデックスを取得する

まっすぐなjavascript（つまり、jQueryなどの拡張機能なし）では、すべての子ノードを繰り返し比較することなく、親ノード内の子ノードのインデックスを決定する方法はありますか？例えば、 var child = document.getElementById('my_element'); var parent = child.parentNode; var childNodes = parent.childNodes; var count = childNodes.length; var child_index; for (var i = 0; i < count; ++i) { if (child === childNodes[i]) { child_index = i; break; } } 子供のインデックスを決定するより良い方法はありますか？

124 javascript dom

9

JavaScriptで選択したオプションテキストを取得する

次のようなドロップダウンリストがあります。 <select id="box1"> <option value="98">dog</option> <option value="7122">cat</option> <option value="142">bird</option> </select> JavaScriptを使用して、値ではなく実際のオプションテキストを取得するにはどうすればよいですか？私は次のようなもので値を得ることができます： <select id="box1" onChange="myNewFunction(this.selectedIndex);" > しかし、7122私が欲しいというよりはcat。

124 javascript html dom drop-down-menu

8

ライブラリを使用せずにquerySelectorAllを使用できない場合に要素を属性で取得しますか？

<p data-foo="bar"> どのようにして同等のことを行うことができます document.querySelectorAll('[data-foo]') どこquerySelectorAllがあり利用できませんか？少なくともIE7で動作するネイティブソリューションが必要です。IE6は気にしません。

123 javascript dom

10

DOMにHTML文字列を追加する

このHTML文字列を追加する方法 var str = '<p>Just some <span>text</span> here</p>'; 'test'DOMにあるID を持つDIVに？（Btw div.innerHTML += str;は受け入れられません。）

121 javascript html dom browser

2

JavaScript querySelectorとgetElementByIdの比較[終了]

休業。この質問は意見に基づいています。現在、回答を受け付けていません。この質問を改善してみませんか？この投稿を編集して、事実と引用で回答できるように質問を更新してください。 5年前休業。この質問を改善する querySelector＆querySelectorAllはDOM要素を選択するための新しい方法であると聞きました。彼らはどのように古い方法と比較し、ないgetElementById＆getElementsByClassNameパフォーマンスおよびブラウザのサポートの面で？ jQueryのクエリセレクターを使用する場合とパフォーマンスはどのように比較されますか？どのネイティブセットを使用するためのベストプラクティスの推奨事項はありますか？

121 javascript jquery dom

7

React.js：contentEditableのonChangeイベント

contentEditableベースのコントロールの変更イベントをリッスンするにはどうすればよいですか？ var Number = React.createClass({ render: function() { return <div> <span contentEditable={true} onChange={this.onChange}> {this.state.value} </span> = {this.state.value} </div>; }, onChange: function(v) { // Doesn't fire :( console.log('changed', v); }, getInitialState: function() { return {value: '123'} } }); React.renderComponent(<Number />, document.body); http://jsfiddle.net/NV/kb3gN/1621/

120 javascript dom contenteditable reactjs

3

JavaScriptを使用してカスタム属性を設定する

DynaTree（https://code.google.com/p/dynatree）を使用していますが、問題が発生しており、誰かが助けてくれることを期待しています。以下のようなページにツリーを表示しています。 <div id="tree"> <ul> <li class="folder">Outputs <ul> <li id="item1" data="icon: 'base.gif', url: 'page1.htm', target: 'AccessPage'">Item 1 Title <li id="item2" data="icon: 'base.gif', url: 'page2.htm', target: 'AccessPage'">Item 2 Title <li id="item3" data="icon: 'base.gif', url: 'page3.htm', target: 'AccessPage'">Item 3 Title <li id="item4" data="icon: 'base.gif', url: 'page4.htm', target: 'AccessPage'">Item 4 Title </ul> </ul> …

119 javascript dom dynatree

10

querySelectorAllを使用して直接の子を取得する

私はこれを行うことができます： <div id="myDiv"> <div class="foo"></div> </div> myDiv = getElementById("myDiv"); myDiv.querySelectorAll("#myDiv > .foo"); つまり、myDivclassを持つ要素の直接の子をすべて正常に取得できます.foo。問題は、要素に対して#myDivクエリを実行しているため、セレクターにを含める必要があるmyDivことです。 #myDivオフのままにしておくべきですが、セレクタはで始まるため、正しい構文ではありません>。セレクターが実行されている要素の直接の子だけを取得するセレクターの作成方法を誰かが知っていますか？

119 javascript dom css-selectors

5

jQueryでインデックスによって要素を取得する

順不同リストとliそのリスト内のタグのインデックスがあります。私は取得する必要がありますliそのインデックスを使用し要素その背景色を変更する必要があります。リスト全体をループせずにこれは可能ですか？つまり、この機能を実現できる方法はありますか？これが私のコードです、これはうまくいくと思います... <script type="text/javascript"> var index = 3; </script> <ul> <li>India</li> <li>Indonesia</li> <li>China</li> <li>United States</li> <li>United Kingdom</li> </ul> <script type="text/javascript"> // I want to change bgColor of selected li element $('ul li')[index].css({'background-color':'#343434'}); // Or, I have seen a function in jQuery doc, which gives nothing to me $('ul li').get(index).css({'background-color':'#343434'}); </script>

117 jquery dom get

3

ChromeデベロッパーツールでXPathまたはCSSセレクターを使用してDOM要素を検索する方法

文書http://code.google.com/chrome/devtools/docs/elements.htmlは、XPathまたはCSSセレクターをサポートしていると述べていますが、試したところ、うまくいきませんでした。誰でもそれを使う方法を知っていますか？

116 dom google-chrome google-chrome-devtools

6

domのレンダリングが終了した後でディレクティブを実行するにはどうすればよいですか？

（Angular JSのドキュメントを読むことで）明らかな解決策がない一見単純な問題があります。 DOM内のコンテナーの高さを定義するために、他のDOM要素の高さに基づいていくつかの計算を行うAngular JSディレクティブがあります。これと同様のことがディレクティブ内で行われています。 return function(scope, element, attrs) { $('.main').height( $('.site-header').height() - $('.site-footer').height() ); } 問題は、ディレクティブが実行さ$('site-header')れると見つからず、必要なjQueryでラップされたDOM要素の代わりに空の配列を返すことです。 DOMが読み込まれた後にのみ実行され、通常のjQueryセレクタースタイルのクエリを介して他のDOM要素にアクセスできるディレクティブ内で使用できるコールバックはありますか？

115 jquery dom callback angularjs document-ready

タグ付けされた質問 「dom」

タグ付けされた質問「dom」