程序设计 dom

16

我想知道是否有一种方法可以计算div中的行数。假设我们有一个像这样的div： <div id="content">hello how are you?</div> 取决于许多因素，div可以包含一行，两行或什至四行文本。脚本有什么办法知道吗？换句话说，DOM中是否完全代表了自动中断？

127 javascript html dom

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; } } 有没有更好的方法来确定孩子的指数？

125 javascript dom

6

innerText，innerHTML，label，text，textContent，outerText

我有一个由Javascript填充的下拉列表。在决定应该在加载时显示的默认值时，我意识到以下属性显示的值完全相同： innerText innerHtml label text textContent outerText 我自己的研究显示基准测试或其中一些（但不是全部）之间的比较。我可以使用自己的常识选择一个或另一个，因为它们可以提供相同的结果，但是，我担心如果数据发生更改，这将不是一个好主意。我的发现是： innerText 将按原样显示该值，并忽略可能包含的任何HTML格式 innerHTML 将显示值并应用任何HTML格式 label似乎与相同innerText，所以我看不到区别 text似乎innerText与jQuery简写版本相同 textContent看起来与相同，innerText但保持格式（例如\n） outerText 似乎与 innerText 我的研究只能采取我太厉害，我只能考什么我能想到的或读到的东西发布后，任何一个可以确认但如果我的研究是正确的，如果有什么特别的label和outerText？

124 javascript html dom

5

通过类名获取DOM元素

我正在使用PHP DOM，并且试图在DOM节点中获取具有给定类名的元素。获得该子元素的最佳方法是什么？更新：我最终使用Mechanize了PHP，它更易于使用。

124 php css 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

6

jQuery中width，innerWidth和externalWidth，height，innerHeight和externalHeight之间的区别是什么

我写了一些例子来看看有什么区别，但是它们显示出相同的宽度和高度结果。 <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(); …

123 javascript jquery css dom styles

8

不使用库而无法使用querySelectorAll时，按属性获取元素吗？

<p data-foo="bar"> 你怎么做相当于 document.querySelectorAll('[data-foo]') 其中querySelectorAll是不可用？我需要至少在IE7中有效的本机解决方案。我不在乎IE6。

123 javascript dom

2

Javascript querySelector vs. getElementById [关闭]

已关闭。这个问题是基于观点的。它当前不接受答案。想改善这个问题吗？更新问题，以便通过编辑此帖子以事实和引用的形式回答。 5年前关闭。改善这个问题我听说querySelector＆querySelectorAll是选择DOM元素的新方法。他们如何比较的老方法，getElementById和getElementsByClassName在性能和浏览器支持方面？与使用jQuery的查询选择器相比，性能如何？是否有针对哪个本机集的最佳实践建议？

122 javascript jquery dom

10

将HTML字符串追加到DOM

如何附加这个HTML字符串 var str = '<p>Just some <span>text</span> here</p>'; 到具有'test'DOM中ID的DIV ？（顺便说一句div.innerHTML += str;是不可接受的。）

121 javascript html dom browser

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设置自定义属性

我正在使用The 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> …

119 javascript dom dynatree

10

使用querySelectorAll检索直接子级

我能够做到这一点： <div id="myDiv"> <div class="foo"></div> </div> myDiv = getElementById("myDiv"); myDiv.querySelectorAll("#myDiv > .foo"); 也就是说，我可以成功检索myDiv具有class 的元素的所有直接子级.foo。问题是，我必须#myDiv在选择器中包含，这使我感到困扰，因为我正在myDiv元素上运行查询（因此显然是多余的）。我应该能够离开#myDiv，但是选择器不是合法的语法，因为它以a开头>。有谁知道如何编写一个选择器，该选择器仅获取运行选择器的元素的直接子代？

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文档）。我有一个Angular JS指令，该指令根据其他DOM元素的高度进行一些计算，以定义DOM中容器的高度。指令内部发生了类似的事情： 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

Questions tagged «dom»