我可以依赖于“tbody”标签的隐含创建吗？ [英] Can I rely on the implicit creation of the `tbody` tag?
问题描述
<！DOCTYPE HTML>
< html>
< head>
< meta http-equiv =content-typecontent =text / html; charset = UTF-8/>
< script src =https://ajax.googleapis.com/ajax/libs/jquery/1.6.3/jquery.min.js>< / script>
< script type =text / javascript>
$（document）.ready（function（）{
$（table> tr> td> input [id]）.each（function（i，element）{
alert（$（element）.attr（'id'））
}）;
}）;
< / script>
< / head>
< body>
< form>
< table>
< tr>< td>城市：< / td>< td>< input type =textid =cityname =city/>< / td> ; / TR>
< tr>< td>状态：< / td>< td>< input type =textid =statename =state/>< / td> ; / TR>
< / table>< br />
< input type =submitvalue =OK/>
< / form>
< / body>
< / html>
当我以这种方式写它不起作用，因为我的浏览器自动创建一个 tbody 标签，所以我必须写
$（table tr> td>输入[id]）.each（function（i，element）{
alert（$（element）.attr（'id'））
}）;
或
$（table> tbody> tr> td> input [id]）.each（function（i，element）{
alert（$（element）.attr '））
}）;
我可以依靠隐藏的 tbody 标签，还是我不该指望？
添加了解释我对Tim Down的回答：
<！DOCTYPE HTML>
< html>
< head>
< meta http-equiv =content-typecontent =text / html; charset = UTF-8/>
< script src =https://ajax.googleapis.com/ajax/libs/jquery/1.6.3/jquery.min.js>< / script>
< script src =https://ajax.googleapis.com/ajax/libs/jqueryui/1.8.16/jquery-ui.js>< / script>
< script type =text / javascript>
$（document）.ready（function（）{
var ids = [];
var form = document.forms [0];
var formEls = form.elements;
var f_len = formEls.length;
for（var i = 0; i< f_len; ++ i）{
ids.push（formEls [i] .id）;
var data = [['one'，'two'，'thre']，['four'，'five'，'six']];
var ids_len = ids.length ;
for（i = 0; i< ids_len; i ++）{
$（＃+ ids [i]）.autocomplete（{
source：data [i]
}）;
}
}）;
< / script>
< / head>
< body>
< form>
< table>
< tr>< td> A：< / td>< td>< input type =textid =aname =a/>< / td>< ; / TR>
< tr>< td> B：< / td>< td>< input type =textid =bname =b/>< / td>< ; / TR>
< / table>< br />
< input type =submitvalue =OK/>
< / form>
< / body>
< / html>
当我运行此操作时，Webconsole会向我显示如下警告：
空字符串getElementById（）被传递。
一个字符串形成由 form.elements返回的字符串是空的。
这不是一个依靠它被自动创建的问题。 b
$ b
问题是否是强制性的。
根据HTML5草案：
如果tbody元素内的
中的第一件是tr元素，那么tbody元素的起始标记可能会被省略，如果元素不是
，一个tbody thead或tfoot元素，其结尾标签
已被省略。
如果tbody元素是
，那么tbody元素的结束标记可能会被省略紧接着是tbody或tfoot元素，或者如果父元素中没有
更多的内容。
所以如果您的代码满足上述条件，您可以省略，否则需要。
与其他人指出，即使它是需要的，并且html解析器不会找到它，因为你没有写它，它将被插入到您的DOM，如html5规范中所述。
这样说，根据经验，永远不会依赖任何人为您自动创建内容！（见下文）
所以即使浏览器会为您创建，这并不意味着较新的浏览器或新版本的同一浏览器将遵循相同的方式，您的代码可能会因此而破裂。
此外，您的JS可以进行优化。
$（document）.ready（function（）{
$（td>输入[id]）.each（function（i，element）{
alert（element.id）;
}）;
}）;
始终在语句结尾处写分号。不要依赖JS引擎为您写信!!! （见上文）
不需要调用jQuery函数，并从元素中创建一个jQuery对象调用
attr（）方法来获取id。JavaScript已经有id（）方法来检索id
如果您的实际标记与您在答案中发布的标记类似，可以这样编写jQuery选择器：
表输入[id]或者，如果你有嵌套表td> input [id]像gilly3的建议。
<!DOCTYPE HTML> <html> <head> <meta http-equiv="content-type" content="text/html; charset=UTF-8" /> <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.6.3/jquery.min.js"></script> <script type="text/javascript"> $( document ).ready( function(){ $( "table > tr > td > input[id]" ).each( function( i, element ){ alert( $( element ).attr( 'id' ) ) }); }); </script> </head> <body> <form> <table> <tr><td>City:</td><td><input type="text" id="city" name="city" /></td></tr> <tr><td>state:</td><td><input type="text" id="state" name="state" /></td></tr> </table><br /> <input type="submit" value="OK"/> </form> </body> </html>When I write it this way it doesn't work because my browser create automatically a
tbodytag so I have to write$( "table tr > td > input[id]" ).each( function( i, element ){ alert( $( element ).attr( 'id' ) ) });or
$( "table > tbody > tr > td > input[id]" ).each( function( i, element ){ alert( $( element ).attr( 'id' ) ) });Can I rely on the implicit creation of the
tbodytag or should I not count on that?
Added to explain my comment to Tim Down's answer:
<!DOCTYPE HTML> <html> <head> <meta http-equiv="content-type" content="text/html; charset=UTF-8" /> <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.6.3/jquery.min.js"></script> <script src="https://ajax.googleapis.com/ajax/libs/jqueryui/1.8.16/jquery-ui.js"></script> <script type="text/javascript"> $( document ).ready( function() { var ids = []; var form = document.forms[0]; var formEls = form.elements; var f_len = formEls.length; for ( var i = 0; i < f_len; ++i ) { ids.push( formEls[i].id ); } var data = [ [ 'one', 'two', 'thre' ], [ 'four', 'five', 'six' ] ]; var ids_len = ids.length; for ( i = 0; i < ids_len; i++ ){ $( "#" + ids[i] ).autocomplete({ source: data[i] }); } }); </script> </head> <body> <form> <table> <tr><td>A:</td><td><input type="text" id="a" name="a" /></td></tr> <tr><td>B:</td><td><input type="text" id="b" name="b" /></td></tr> </table><br /> <input type="submit" value="OK"/> </form> </body> </html>When I run this, the Webconsole shows me a warning something like this:
Empty string to getElementById () is passed.
One string form the strings returned byform.elementsis empty.解决方案It's not a question on relying on it being automatically created or not.
The question is if it's mandatory or not.
According to the HTML5 draft:
A tbody element's start tag may be omitted if the first thing inside the tbody element is a tr element, and if the element is not immediately preceded by a tbody thead, or tfoot element whose end tag has been omitted.
A tbody element’s end tag may be omitted if the tbody element is immediately followed by a tbody or tfoot element, or if there is no more content in the parent element.
So you can actually omit it if your code met the above conditions, otherwise it is needed.
As other people pointed out, even if it is needed, and the html parser won't find it because you didn't write it, it will be inserted into the DOM for you, as stated in the html5 specs.
This said, as a rule of thumb, never rely on anyone creating something automatically for you! (see below)
So even if the browser will create it for you, this doesn't mean newer browsers or new version of the same browser will follow the same way, and your code may become broken then.
Also, your JS could be optimized.
$( document ).ready( function(){ $( "td > input[id]" ).each( function( i, element ){ alert( element.id ); }); });
Always write semicolons at the end of statements. Don't rely on the JS engine write them for you!!! (see above).
No need to call the jQuery function and create a jQuery object out of element just to call the
attr()method to get the id. JavaScript already has theid()method to retrieve the id.If your actual markup is like the one you posted in your answer, you could write the jQuery selector like this:
table input[id]. Or, if you have nested tablestd > input[id]like gilly3 suggested.
这篇关于我可以依赖于“tbody”标签的隐含创建吗？的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！
