Javascript Best Practices Document v1.0 [英] Javascript Best Practices Document v1.0

查看:80
本文介绍了Javascript Best Practices Document v1.0的处理方法,对大家解决问题具有一定的参考价值,需要的朋友们下面随着小编来一起学习吧!

问题描述

http://www.JavascriptToolbox.com/bestpractices/


我开始写这篇文章作为一些人的指南,这些人正在寻找关于如何用Javascript正确的方式做事的一般提示。例如,他们的代码

中充斥着document.all和eval,我想创建

a实用的最​​佳实践列表,他们可以很容易地使用它们。 />

以上网址是版本1.0(草稿)的结果。 IMO,它不是常见问题解答的替代品,而是一个更实用的指南,用于解决通常被推入网站的一些

问题。


有什么意见吗?


PS:忽略格式化。现在这很丑陋;)


PPS:我知道很多最佳实践中有例外情况。

非常经验丰富的作者接洽时的特定情况,但本文档的目的是帮助普通的joe开发人员修复常见的问题并编写更多可接受的代码。


-

Matt Kruse
http://www.JavascriptToolbox.com
http:// www。 AjaxToolbox.com

http://www.JavascriptToolbox.com/bestpractices/

I started writing this up as a guide for some people who were looking for
general tips on how to do things the ''right way'' with Javascript. Their code
was littered with document.all and eval, for example, and I wanted to create
a practical list of best practices that they could easily put to use.

The above URL is version 1.0 (draft) that resulted. IMO, it is not a
replacement for the FAQ, but a more practical guide for fixing some of the
problems that commonly get pushed into web sites.

Any comments?

PS: Ignore the formatting. It''s ugly, for now ;)

PPS: I know that there are exceptions to many of the ''best practices'' in
very specific situations when approached by an experienced author, but the
goal of this document is to help the average joe developer fix common
problems and write more acceptable code.

--
Matt Kruse
http://www.JavascriptToolbox.com
http://www.AjaxToolbox.com

推荐答案

Matt Kruseaécrit:
Matt Kruse a écrit :
http://www.JavascriptToolbox.com/bestpractices/

我开始写这篇文章一些人正在寻找关于如何做事的一般提示的指南使用Javascript的方式''。


好​​主意!我支持这样的倡议。


他们的代码充斥着document.all和eval,


你很可能是对的。网站上DHTML / javascript
代码的最高nr 1问题仍然是求助于document.all。直到今天,在这个非常新闻组中,很多人仍然以支持MSIE 4的名义推广它......我认为这只是愚蠢的。全球互联网/网络用户中不到0.5%的b / b
仍在使用MSIE 4,而某些DHTML / javascript内容可以在MSIE 4上有效运行的可能性非常小。

所以,我建议放弃document.all无处不在......包括在这个

新闻组中。


for例如,我想创建一个他们可以轻松使用的最佳实践的实用列表。

上面的URL是版本1.0(草稿)。 IMO,它不是常见问题解答的替代品,而是一个更实用的指南,用于解决通常被推入网站的一些问题。

任何评论?< br:> PS:忽略格式化。现在这很难看;)
http://www.JavascriptToolbox.com/bestpractices/

I started writing this up as a guide for some people who were looking for
general tips on how to do things the ''right way'' with Javascript.
Good idea! I support such initiative.

Their code was littered with document.all and eval,
You''re most likely right. The top nr 1 problem with DHTML/javascript
code on the web is still the recourse to document.all. Still today, in
this very newsgroup, a lot of people are still promoting it in the name
of supporting MSIE 4 ... which I think is just stupid. Less than 0.5% of
internet/web users worldwide are still using MSIE 4 and the chances that
some DHTML/javascript stuff can effectively work on MSIE 4 is very slim.
So, I''d recommend to ditch document.all everywhere... including in this
newsgroup.

for example, and I wanted to create a practical list of best practices that they could easily put to use.

The above URL is version 1.0 (draft) that resulted. IMO, it is not a
replacement for the FAQ, but a more practical guide for fixing some of the
problems that commonly get pushed into web sites.

Any comments?

PS: Ignore the formatting. It''s ugly, for now ;)




格式化对我来说还可以。

1-我认为你应该从某事开始基本上解释说

document.all是坏的,错误的,已弃用的,过时的等等。


2-引用表单的Web标准方式输入元素是:


document.forms.namedItem(" formname")。elements.name dItem(" inputname")

http://www.w3.org/ TR / DOM-Level-2-HTM ... tml#ID-1689064

http://www.w3.org/TR/DOM-Level-2-HTM...ml#ID-21069976

http://www.w3.org/TR/DOM-Level-2-HTM...ml#ID-76728479


3 - 所有表格的名称应为att ribute。使用

索引引用表单(例如document.forms [0]是不好的做法。)

表格的名称属性在XHTML规范中被删除。所以你可能会想要在那里添加这种细微差别/相对论。


4-< form name =" myform">

< input type =" text"名称= QUOT; VAL1" value =" 1">

< input type =" text"名称= QUOT; val2的" value =" 2">

< / form>

将触发DTD严格的验证标记错误。


5-为了解决这个问题,Javascript需要提示告诉它将

值视为数字,而不是字符串。从值中减去0

将强制javascript将值视为数字,然后使用

数字上的+运算符将执行加法,而不是

连接。

我认为你可能实际上在教一个错误的技巧。什么是错误的

提供使用parseInt(strValParam,indexParam)来实现你想要实现的... b $ b将字符串转换为整数

或使用parseFloat(strValParam)。


6-这就是为什么''返回false;''通常包含在结尾处代码

在一个onClick处理程序中。

我会删除那句话。这句话并不能完美地表达

感。另外,我们不知道doSomething()函数究竟做了什么......


7-通常,链接只包含href ="#为了简单起见,当你确定你的用户将启用了javascript时,



这也是很多人谴责编码行为不良的原因。

链接应该是一个链接。玫瑰应该是玫瑰。并且href ="#"很糟糕

练习IMO。

附录:我看到你后来不鼓励这种做法。


8- IMO,你没有充分解释为什么href =" javascript :..."

糟糕。我可以推荐一些列出的原因:
:window.open.28 .... 29.22 _.... 3Etarget =_ blank> http://developer.mozilla.org/en/docs.....29.22_ .. ..3E


9-在您的检测浏览器版本中部分,你可能想给

更多参考资料:

- 浏览器识别方法(又名浏览器嗅探):不是最好的,

不可靠的方法
http:// www .mozilla.org / docs / web-deve ... l#BrowserIdent

- 使用对象/特征检测方法:最佳和整体最可靠
http://www.mozilla.org/docs/web-deve .. .jectFeatDetect

- 浏览器检测 - 否;物体检测 - 是 - Peter-Paul Koch
http:// www .quirksmode.org / js / support.html

- 浏览器检测和跨浏览器支持(特别是第5节
和6):
http://developer.mozilla.org/en/docs...rowser_Support


10-

使用document.all的规则是

2.只回到使用document.all作为最后的手段

3.仅在需要IE 5.0支持或更早版本时使用它

但IE 5.0支持getElementById。使用

document.all的唯一可能原因是你绝对需要为IE 4.x编码。为什么你想要做一些可能(可能)在IE 4.x中工作的DHTML?

我没有看到使用文档的原因。再好了。


问候,

$ b $bGérard

-

删除等等给我发电子邮件



The formatting is ok for me.
1- I think you should start with something as basic as explaining that
document.all is bad, wrong, deprecated, obsolete, etc..

2- The web standards way to reference a form input element is:

document.forms.namedItem("formname").elements.name dItem("inputname")

http://www.w3.org/TR/DOM-Level-2-HTM...tml#ID-1689064

http://www.w3.org/TR/DOM-Level-2-HTM...ml#ID-21069976

http://www.w3.org/TR/DOM-Level-2-HTM...ml#ID-76728479

3- "All forms should have a name attribute. Referencing forms using
indexes, such as document.forms[0] is bad practice."
name attribute for form was dropped in XHTML specification. So you may
want to add such nuance/relativity in there.

4- <form name="myform">
<input type="text" name="val1" value="1">
<input type="text" name="val2" value="2">
</form>
will trigger a validation markup error with a DTD strict.

5- "To fix this problem, Javascript needs a hint to tell it to treat the
values as numbers, rather than strings. Subtracting 0 from the value
will force javascript to consider the value as a number, and then using
the + operator on a number will perform addition, rather than
concatenation."
I think you may be in fact teaching a wrong trick. What''s wrong with
offering to use parseInt(strValParam, indexParam) to achieve exactly
what you want to achieve... which is converting a string into an integer
or to use parseFloat(strValParam).

6- "This is why ''return false;'' is often included at the end of the code
within an onClick handler."
I would remove that sentence. The sentence does not perfectly make
sense. Also, we have no idea what the doSomething() function does exactly...

7- "Often, links will just contain href="#" for the sake of simplicity,
when you know for sure that your users will have javascript enabled."
This is what a lot of people denounce also as bad coding practices. A
link should be a link. A rose should be a rose. And href="#" is just bad
practice IMO.
Addendum: I see that you later discourage that practice.

8- IMO, you do not sufficiently explain why href="javascript:..." is
bad. May I recommend some of the reasons listed here:
:window.open.28....29.22_....3E" target="_blank">http://developer.mozilla.org/en/docs.....29.22_....3E

9- In your "Detecting Browser Versions" section, you may want to give
more references:
- Browser identification approach (aka "browser sniffing"): not best,
not reliable approach
http://www.mozilla.org/docs/web-deve...l#BrowserIdent
- Using Object/Feature detection approach: best and overall most reliable
http://www.mozilla.org/docs/web-deve...jectFeatDetect
- Browser detection - No; Object detection - Yes by Peter-Paul Koch
http://www.quirksmode.org/js/support.html
- Browser Detection and Cross Browser Support (in particular, sections 5
and 6):
http://developer.mozilla.org/en/docs...rowser_Support

10-
"The rules for using document.all are
2. Only fall back to using document.all as a last resort
3. Only use it if you need IE 5.0 support or earlier "
but IE 5.0 supports getElementById. The only possible reason to use
document.all is if you absolutely need to code for IE 4.x. And why would
you want to do some DHTML which would (could possibly) work in IE 4.x?
I don''t see a reason for using document.all anymore.

Regards,

Gérard
--
remove blah to email me


Matt Kruse写道:
Matt Kruse wrote:
http://www.JavascriptToolbox.com/bestpractices/
我开始写这篇文章作为一些正在寻找的人的指南/>关于如何使用Javascript正确方式做事的一般提示。
http://www.JavascriptToolbox.com/bestpractices/

I started writing this up as a guide for some people who were looking for
general tips on how to do things the ''right way'' with Javascript.



[...]


你有没有想把它作为一个维基?那样的贡献者

为你建立你最好的网站 - 它可能会变得非常广泛!


有一些'很好'最佳实践''示例或存根

各种各样的东西 - 表单验证,动态HTML东西获取xml文件,

日历和日期选择器等 - 而不是过多具有

半生不熟的解决方案的网站。


[...]


-

Rob


[...]

Have you thought of putting it up as a wiki? That way contributors
build your ''best of'' site for you - it might get quite extensive though!

It would be good to have some ''best practice'' examples or stubs for
various things - form validation, dynamic HTML stuff getting xml files,
calendars and date pickers, etc. - rather than a plethora of sites with
half-baked solutions.

[...]

--
Rob


On 11/10/2005 07:02,GérardTalbot写道:


[snip]
On 11/10/2005 07:02, Gérard Talbot wrote:

[snip]
1-我认为你应该从基本解释为
document.all是坏的,错误的,弃用的,过时的等等开始。


但是所有的收藏都既不坏也不错。可以说它是b / b
它在很大程度上是多余的,但即使在IE5.x中也有一个有用的用途

(虽然不是IE6)。

2-引用表单输入元素的Web标准方法是:

document.forms.namedItem(" formname")。elements.name dItem(" inputname")


Matt所写的内容与合规一样。阅读ECMAScript绑定。它还可以从更好的支持中获益(因此它本身更好)。

3-所有表格都应该有一个名称属性。使用
索引引用表单(例如document.forms [0]是不好的做法。)在XHTML规范中删除了表单的名称属性。


那么?什么与任何事情有关?


如果NN4(等等)不被考虑(他们不需要为

客户端表单验证),然后使用id属性,或直接传递

引用并完全省略标识符。但是,如果需要名称

属性,则使用它。

4-< form name =" myform">
<输入类型= QUOT;文本"名称= QUOT; VAL1" value =" 1">
< input type =" text"名称= QUOT; val2的" value =" 2">
< / form>
将触发DTD严格的验证标记错误。


如果您正在写XHTML Strict DTD,但这可能比对DTD的合理蔑视更糟糕了



5-为了解决这个问题,Javascript需要提示告诉它将
值视为数字,而不是字符串。从值中减去0
将强制javascript将值视为数字,然后使用
数字上的+运算符将执行加法,而不是串联。


我会建议使用一元加(+)运算符。

我认为你可能实际上在教一个错误的技巧。
提供使用parseInt(strValParam,indexParam)来实现你想要实现的目标有什么不对...


它是'在大多数情况下矫枉过正。该值应该已经验证

已经存在,所以所有必要的是转换一元

加上运算符的值非常好。


parseInt函数在同时使用它时非常有用

剥离非数字尾随字符并转换,例如用CSS

长度值。

6-这就是为什么''返回false;''通常包含在代码的末尾
在onClick处理程序中。
我会删除那句话。这句话并不完美有意义。


在上下文中使用它是完全合理的。

另外,我们不知道doSomething()函数究竟做了什么...


你知道这只是一个例子,不是吗。 :P

7-通常,链接只包含href ="#为了简单起见,
当你确定你的用户将启用javascript时。
这就是许多人谴责编码行为不良的原因。
1- I think you should start with something as basic as explaining that
document.all is bad, wrong, deprecated, obsolete, etc..
But the all collection is neither bad nor wrong. It can be argued that
it is largely redundant, but even in IE5.x is has a useful purpose
(though not IE6).
2- The web standards way to reference a form input element is:

document.forms.namedItem("formname").elements.name dItem("inputname")
What Matt wrote is just as ''compliant''. Read the ECMAScript bindings. It
also benefits from better support (so it is better in itself).
3- "All forms should have a name attribute. Referencing forms using
indexes, such as document.forms[0] is bad practice."
name attribute for form was dropped in XHTML specification.
So? What''s that got to do with anything?

If NN4 (and the like) aren''t a consideration (and they needn''t be for
client-side form validation), then use an id attribute, or pass
references directly and omit an identifier entirely. However, if a name
attribute is necessary, then use it.
4- <form name="myform">
<input type="text" name="val1" value="1">
<input type="text" name="val2" value="2">
</form>
will trigger a validation markup error with a DTD strict.
If you''re writing to an XHTML Strict DTD, but that is arguably worse
than reasonable defiance of the DTD.
5- "To fix this problem, Javascript needs a hint to tell it to treat the
values as numbers, rather than strings. Subtracting 0 from the value
will force javascript to consider the value as a number, and then using
the + operator on a number will perform addition, rather than
concatenation."
I would recommend the unary plus (+) operator instead.
I think you may be in fact teaching a wrong trick. What''s wrong with
offering to use parseInt(strValParam, indexParam) to achieve exactly
what you want to achieve...
It''s overkill in most cases. The value should have been validated
already, so all that''s necessary is to convert the value which the unary
plus operator does very well.

The parseInt function can be very useful when using it to simultaneously
strip non-numeric trailing characters and convert, such as with CSS
length values.
6- "This is why ''return false;'' is often included at the end of the code
within an onClick handler."
I would remove that sentence. The sentence does not perfectly make
sense.
It makes perfect sense when taken in context.
Also, we have no idea what the doSomething() function does exactly...
You do know that it''s just an example, don''t you. :P
7- "Often, links will just contain href="#" for the sake of simplicity,
when you know for sure that your users will have javascript enabled."
This is what a lot of people denounce also as bad coding practices.



如果在脚本范围之外使用它是不好的做法。

但是,如果脚本生成这样的链接,那么它''不是问题。我相信这是马特瞄准的目标(通知,''肯定知道''),但

也许应该强调,因为警告可能不会请注意。


[snip]


我还没读过这份文件。我会在一些

点左右... ...


Mike


- -

迈克尔·温特

前缀主题[新闻],然后通过电子邮件回复。



It''s bad practice when that''s used outside the scope of a script.
However, if a script generates such a link, then it''s not an issue. I
believe that''s what Matt was aiming at (notice, ''know for sure''), but
perhaps it should be emphasised as the caveat might not be noticed.

[snip]

I haven''t really read the document yet. I''ll get around to it at some
point... :)

Mike

--
Michael Winter
Prefix subject with [News] before replying by e-mail.


这篇关于Javascript Best Practices Document v1.0的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!

查看全文
登录 关闭
扫码关注1秒登录
发送“验证码”获取 | 15天全站免登陆