使用 jquery 添加用于样式/换肤的 html 标记真的很糟糕吗？
我有一个问题，这不是最清楚的，但我想看看是否有人对此有一些想法！
我正在开发一款应用程序，目前我们只有一个主题，但将来我们会有许多不同的主题，所以这个问题一直在我脑海中萦绕……
如果您从干净的 HTML 开始，然后添加用于样式目的的元素，可以使用 jQuery 添加额外的元素吗？我认为以这种方式添加内容可以更轻松地制作适应性布局，并使代码更清晰、更易于理解，但我总是听说这是不好的做法。
我使用这个系统来快速模拟文件，它比通过文件、函数和类堆栈进行排序来添加此标记要快得多。
除了费力地浏览大量代码之外，还有哪些添加此类标记的替代系统的示例？也许可以使用灵活的静态两列布局的示例，或者在整个站点中制作滑动门按钮...如果有人想尝试一下，您也可以使用表单作为示例（对我来说这很棘手）就高级样式而言）...并且，天堂不允许，将其全部切换为从右到左的语言布局！
希望一些字体端开发人员能够理解我想要将样式标记与功能标记分开的问题。我很感激任何人都可以推荐的想法/建议/教程！
谢谢！
I have a question, it's not the clearest but I wanted to see if anyone might have some ideas on it!
I'm working on an app, currently we only have one theme but in the future we will have many different ones, so this question's been on my mind a lot....
If you start off with clean HTML, and are just adding elements for styling purposes, is it ok to use jQuery to add extra elements? I think adding things this way makes it much easier to make adaptable layouts, and keeps your code cleaner and easier to understand, but I've always heard it's bad practice.
I use this system for quickly mocking up the files and it is so much faster than sorting through stacks of files and functions and classes to add this markup.
What are some examples of alternative systems for adding this sort of markup besides trudging through tons of code? Maybe with the example of making a static two column layout flexible, or making a sliding doors button throughout the site...if anyone wants to take a stab at it you can also use forms as an example (something that for me has been tricky in terms of advanced styling)...and, heaven forbid, making it all switch to a right to left language layout!
Hopefully some font-end developers can sort of understand my question of wanting to keep my styling markup vs. functional markup separate. I appreciate any thoughts/suggestions/tutorials anyone can recommend!
Thanks!
如果你对这篇内容有疑问，欢迎到本站社区发帖提问 参与讨论，获取更多帮助，或者扫码二维码加入 Web 技术交流群。
绑定邮箱获取回复消息
由于您还没有绑定你的真实邮箱，如果其他用户或者作者回复了您的评论，将不能在第一时间通知您！
发布评论
评论（5）
这几乎就是 jQuery Mobile 的格式化方式。
您需要在一个元素上放置一个或两个属性（或者对于基本元素不放置任何属性），然后当您的 jQM 页面即将呈现时，jQM 就会出现，并将大量类添加到格式化它以适应的元素中。
不好的做法——不！
良好的实践，可能特别是如果您希望您的主题完全不同的话
可能应该添加一些最小的“固定”样式将帮助那些选择关闭 JavaScript 的人。
That's pretty much the way jQuery Mobile does it's formatting.
You need to put an attribute or two on an element (or nothing for basic elements) and then when your jQM page is about to be rendered jQM comes along and adds heaps of classes to the elements formatting it to suit.
Bad Practice - No!
Good Practice, probably especially if you intend your themes to be radically different
Should probably add that some minimal 'fixed' styling would help those who chose to turn off javascript.
我对你的问题的理解是：“添加诸如以下内容可以吗：
使用 jQuery 来保持我的 HTML 干净？”。
我不知道标准，但我尝试使我的 html 尽可能保持静态。如果某些东西可能需要顶盖，但设计不需要它——无论如何它都在我的 html 中。
我这样做是为了减少客户端加载时间。我不介意编写/提供额外的 HTML，但我讨厌浏览器在加载时必须创建新元素。
my understanding of your question: "is it OK to add things like:
with jQuery to keep my HTML clean?".
i don't know the standard, but i try to keep my html as static as possible. if something might need a top cap, but the design doesn't call for it -- it's in my html anyways.
i do this to keep client-side load time down. i don't mind writing/delivering additional HTML, but I hate when my browser has to make new elements when it loads.
首先，动态添加项目很好，例如：
我正在开发一个基于模板的应用程序。我这样做的方法是创建一个 html 模板，然后使用 ajax 将其加载到主容器中。这样我就可以将页面作为模板放在 HTML 文件夹中，并在需要时将它们拖到“场景”中。
编辑：您应该注意，搜索引擎索引可能看不到标记。
First of all adding items dynamically is fine, for example:
I'm working on a template based app. The way i do it is that i create an html template and then i load it into a main container using ajax. That way i can have pages lying as templates in an HTML folder and drag them into the "scene" when needed.
Edit: You should be aware that the markup probably wont be visible for search engines to index.
我编写过使用 JSON 并用 JavaScript 构建 90% UI 的应用程序。因为这是一个应用程序而不是页面，所以我们为 SEO 和语义 HTML 所做的很多工作并不真正适用。我从来没想过谷歌会索引这个页面。
无论如何，我尝试将标记保持在最低限度，以使结构和样式发挥作用。
还有一个渐进增强的问题：从基本的 HTML 开始，然后使用 JS 添加功能。这是一个不好的做法吗——不，不是。
I've written apps that consume JSON and build 90% of the UI in JavaScript. Because this is an APPLICATION and not a PAGE, a lot of what we do for SEO and semantic HTML doesn't really apply. I'd never expect Google to index this page.
Regardless, I try to keep the mark-up to a minimum to allow the structure and styling to work.
There is also the issue of progressive enhancement: starting off with basic HTML, then using JS to add functionality. Is this a bad practice -- no, not really.
CSS 似乎仍然是你正在寻找的东西。当您为元素提供类和 ID 时，请在您希望内容传达的功能之后命名这些类和 ID。例如，假设在当前布局中，您想要一个亮红色警报区域来显示错误消息：不要将该类命名为“red”，而是尝试将其命名为“class=”alert”。这样，如果您决定重新设计整个网站，您只需制作一个新的 css 样式表并更改整个布局，而无需编辑 HTML 或 Javascript。这样做的另一个优点是，适当地使用类和 ID 将使您将来必须使用 JQuery 执行的任何交互变得更加容易。
CSS Seems to still be what you are looking for. When you give elements classes and ID's, name those classes and ID's after the function you want the content to convey. For example, Let's say in your current layout you want a bright red alert area for error messages: Instead of naming that class="red", try naming it class="alert". That way if you decide to re-skin the whole site you can simply make a new css stylesheet and change your entire layout without ever having to edit HTML or Javascript. Another advantage to this is that using classes and ID's appropriately will make any interaction you have to perform using JQuery much easier in the future.