小编Jo *_*gue的帖子

CSS特异性的最佳实践?

我正在创建一个联系表单,该表单将包含在几个不同的站点上.

联系表格的样式和网站的样式都将包含在内,我无法很好地预测网站的样式.我希望联系表单的样式很容易被网站的样式所覆盖,但我不希望联系表单的样式被意外地过度统治.

例如,如果站点开发人员想要更改提交按钮的颜色,则应该可以在不使用!important或某些特定#id #id element .class #id element.class类型的选择器的情况下轻松完成.

但是,另一方面,如果网站开发人员使用选择器编写样式,input { background: yellow; }或者#site-wrapper input { background: yellow; }我不希望它过度规则我的联系表单样式引用类,.contact_input { background: white; }

所以我的问题是,在这种情况下最佳做法是什么?我正在考虑在我的表单上添加一个ID并将其添加到每个选择器,因此我的选择器将成为#contactform .contact_input { background: white; }我认为这将有助于避免冲突,但我想知道是否有更好的方法来做到这一点,因为这在页面渲染方面似乎有点无效.也许这不是什么大不了的事,但我只是想把它扔出去看看人们的想法.

css performance conflict css-specificity

6
推荐指数
1
解决办法
1271
查看次数

如何读取Node.js中的文件?

在Node.js中,我想读取一个文件,然后console.log()将文件的每一行分开\n.我怎样才能做到这一点?

javascript filesystems file fs node.js

6
推荐指数
1
解决办法
508
查看次数

如何在 Chrome 的性能分析器中调试匿名 JavaScript 函数?

我正在使用 Angular 4,并且使用了很多匿名箭头函数 ( () => {})。是否可以在不给出名称的情况下确定我正在 Chrome 性能分析器中调试哪些函数?

这是我正在查看的示例;

截屏

javascript performance google-chrome google-chrome-devtools angular

6
推荐指数
1
解决办法
2799
查看次数

为什么话语运行如此缓慢?

我不确定链中的哪个链接引起了问题。我刚刚完成了在Windows计算机上在Vagrant上设置Discourse的工作。一切似乎都运行良好,只是Discourse在浏览器中加载花费了86000毫秒(一分半钟!)。某事告诉我,它不应该那么慢。在哪里可以找到可能导致此问题的问题?

ruby virtualbox vagrant discourse

5
推荐指数
1
解决办法
1119
查看次数

如何防止嵌套的Bootstrap崩溃元素在父级上触发.show()?

这是我设置的jsfiddle;

http://jsfiddle.net/7LBr5/1/

你会注意到我在父手风琴上有指示箭头,还有一个在手风琴显示和隐藏时切换它们的功能.问题是内部折叠区域(用于隐藏产品详细信息)会触发切换父级箭头的功能.当子进程实际上是折叠时,似乎必须在父崩溃元素上触发.show()事件.

我该如何解决这个问题,以便儿童崩溃不会切换父母的箭头?

这是我的函数的代码;

$('.collapse').on('show', function(){
$(this).parent().find(".icon-chevron-right").removeClass("icon-chevron-right").addClass("icon-chevron-down");}).on('hide', function(){
$(this).parent().find(".icon-chevron-down").removeClass("icon-chevron-down").addClass("icon-chevron-right");});
Run Code Online (Sandbox Code Playgroud)

javascript jquery jsfiddle twitter-bootstrap

4
推荐指数
1
解决办法
5568
查看次数

JSON.parse() 和转义字符在 JavaScript 中如何工作?

假设我有一个对象变量:

var obj = {
    key: '\"Hello World\"'
}
Run Code Online (Sandbox Code Playgroud)

JSON.stringify然后我尝试在 Chrome devtools 控制台中使用将其解析为字符串:

JSON.stringify(obj) // "{"key":"\"Hello World\""}"
Run Code Online (Sandbox Code Playgroud)

我得到结果了"{"key":"\"Hello World\""}"。然后我把它交给一个字符串

var str = '{"key":"\"Hello World\""}'
Run Code Online (Sandbox Code Playgroud)

至少我尝试将其转换回 obj:

JSON.parse(str);
Run Code Online (Sandbox Code Playgroud)

但浏览器告诉我错误Uncaught SyntaxError

让我困惑的是为什么这是错误的?我从原始对象获取字符串,我只想将其返回。

我该如何解决这个问题?如果我想做像将 obj 转换为字符串并将其返回这样的工作,我该怎么办?

javascript json escaping

2
推荐指数
1
解决办法
3318
查看次数

如何在OpenLayers中创建双色虚线样式?

我想在OpenLayers中为一个特征添加一个带有两种交替颜色的虚线笔划.基本上,我想在多边形周围创建一个双色轮廓,这样无论背景是什么颜色它都会显示出来.我希望最终结果看起来像这样;

OpenLayers的两个彩色笔画示例

如何在OpenLayers中定义这种样式?

openlayers openlayers-3

2
推荐指数
1
解决办法
2258
查看次数

使用PHP测试IE

我正在开发一个将在几个不同的上下文中使用的网页,虽然我通常不惜一切代价避免浏览器嗅探和条件语句,但这次没有办法解决它.

我正在尝试一种简单的方法,我希望能得到一些关于这是否是个好主意的反馈.

我正在测试用户代理,然后如果用户代理是IE,则在html(在我的例子中是div)中的元素上回显类.

<?php echo (strpos(strtolower($_SERVER['HTTP_USER_AGENT']), 'msie') !== FALSE) ? ('classforie') : (''); ?>
Run Code Online (Sandbox Code Playgroud)

然后在我的CSS中,我正在做一些与此相关的事情;

.classone { display: inline-block; }
.classone.classforie { zoom: 1; display: inline; }
Run Code Online (Sandbox Code Playgroud)

注意,CSS不是重要的部分,我只是为了举例说明了这一点.我只是想知道这样做是否是一种好的做法?

css php cross-browser browser-detection

1
推荐指数
1
解决办法
116
查看次数

什么是支持ASP突出显示和ZenCoding的优秀免费IDE?

我是Eclipse的忠实粉丝.它支持ZenCoding,没问题.但是只有一个支持ASP突出显示的插件,它在查找匹配对方面做得非常蠢,这是一个非常基本的功能.那么,有没有其他好的免费(或廉价)IDE有一个ZenCoding插件,并与ASP一起使用?(黑暗的主题和性感的UI是一个加号!)

ide asp-classic emmet

1
推荐指数
1
解决办法
2962
查看次数

Browserify有替代品吗?

我想从Node.js生成客户端JavaScript.我找到了Browserify,但除了Browserify还有其他选择吗?

node.js browserify

0
推荐指数
1
解决办法
2640
查看次数

有没有办法让“反应脚本”在构建的根目录中包含额外的文件?

我的情况:

我正在托管使用create-react-appSurge 创建的应用。为了让Surge react-router处理路由,我必须在根目录中添加200.html,并且要处理404,必须在根目录中添加404.html。问题在于,npm run build仅使用index.html和将favicon.ico它们添加到构建目录的根目录中。

可能的解决方案:

我可以通过build在package.json中创建脚本来复制其他文件react-scripts build && cp 200.html 404.html build

题:

有没有更好的方法来react-scripts将额外的文件添加到构建的根目录,而不是依靠package.json中的bash脚本?

reactjs react-router react-scripts create-react-app surge.sh

0
推荐指数
1
解决办法
1820
查看次数