小编Ori*_*iol的帖子

这个问题是[]的一个衍生产品,是Array的一个实例,但""不是String的实例

鉴于

"" instanceof String; /* false */
String() instanceof String; /* false */
new String() instanceof String; /* true */

和

typeof "" === "string"; /* true */
typeof String() === "string"; /* true */
typeof new String() === "string"; /* false */

然后,如果我有一个变量abc,我想知道它是否是一个字符串,我可以做

if(typeof abc === "string" || abc instanceof String){
    // do something
}

有没有更简单,更短和本地的方式,或者我必须创建自己的功能？

function isStr(s){
    return typeof s === "string" || s instanceof String;
}
if(isStr(abc)){
    // do something
}

我知道这个主题是满口的,但我找不到一个更好的方式来描述它.

我有一个标题,内容正文,页脚布局,其中页脚是'粘性'使用flex css,这非常有效.我在内容体中有另一个容器需要扩展以填充可用高度,当它的内容被追加时,它会滚动.到目前为止,我能够使用它的唯一方法是将内容体的高度设置为静态px值,这会破坏我所需的垂直响应性.

Codepen我的尝试:http://codepen.io/sinrise/pen/QwKPKp

html, body {
  height: 100%;
  margin: 0; padding: 0;  /* to avoid scrollbars */
}
#wrapper {
  display: flex;  /* use the flex model */
  min-height: 100%;
  flex-direction: column;  /* learn more: http://philipwalton.github.io/solved-by-flexbox/demos/sticky-footer/ */
}
#header {
  background: yellow;
  height: 30px;  /* can be variable as well */
}
#body {
  flex: 1;
  border: 1px solid orange;
  padding-bottom: 20px;
}
.content {
  border: 1px solid gray;
  margin: 10px 0 0;
  width: 500px;
  margin: 0 …

有没有人知道如何修复(明显的)IE渲染错误:在/之前/:在高度之后？

从它的外观来看,IE似乎只想到一个:before /:之后的伪元素和父元素<TD>里面的内容一样高.如果<TD>#1是x2行高w内容而<TD>#2只有x1行内容,IE将只渲染:在<TD>#2 之前的/之后:高度与x1行的内容价值一样高.

我在这里创建了一个小提琴示例,以便更好地说明我的问题:http: //jsfiddle.net/231gnfpz/ 注意:我添加了一个红色背景:before /:after以更好地帮助在IE中可视化我的问题

在我的例子中,我有一个中间<TD>我应用了:在/之后尝试在特定列的外部创建一个box-shadow.它是一个旧项目,所以我没有权限重写整个表格,FireFox/Chrome似乎没有问题,IE8-11似乎与我有同样的问题:之前/:有一个高度:100% .

码:

table {
  background: grey;
  width: 100%;
}
table td {
  text-align: center;
  vertical-align: top;
  background: white;
  padding: 4px;
  width: 33.33%;
  position: relative;
}
.testTD:before {
  box-shadow: -15px 0 15px -15px grey inset;
  content: " ";
  height: 100%;
  left: -15px;
  position: absolute;
  top: 0;
  width: 15px;
  background: Red;
}
.testTD:after {
  z-index: 1;
  box-shadow: 15px 0 15px -15px …

这是我的代码:

var myArr = [1,2,3,4,5];
function queue(arr, item) {
  return arr.push(item).shift();
}

我正在尝试创建一个函数队列,它将"数组"和"项"作为参数.我需要

1. 将项添加到数组的末尾
2. 删除数组的第一个元素
3. 返回已删除的元素.

我的代码不起作用.你能帮我搞清楚吗？

这是有问题的代码:

const data =
  results.responses.map((response, idx) =>
    { id: idx+1,
      name: response.name,
      email: response.email,
      comment: response.comment
    }
  )

我正在使用babel将es6代码翻译为javascript.这是错误消息:

Module build failed: SyntaxError: /Users/antkong/dev/project/form.js: Unexpected token (60:14)
  58 |       results.responses.map((response, idx) =>
  59 |         { id: idx+1,
> 60 |           name: response.name,
     |               ^
  61 |           email: response.email,
  62 |           comment: response.comment
  63 |         }

为什么会出现语法错误？

我是JavaScript的初学者.一本JavaScript书说,其中一个缺点element.innerHTML是:

事件处理程序可能不再按预期工作.

我无法理解这是什么意思.有人能举个例子吗？

我在尝试这个:

//this represents all of the select tags on the page
var select = document.getElementsByTagName("select");

//Listener for when the option changes
select.addEventListener("change", hi(), false);

function hi() {
  alert("hi");
}

<select>
  <option>one</option>
  <option>two</option>
</select>

但事件监听器似乎没有工作,在jsfiddle它可以在页面加载时工作,但不是在我更改选项时...

我正在尝试两个divs 之间的垂直线.但我不希望它与divs 具有相同的高度.我需要说从顶部切割10%,从底部切割10%.

.container {
  display: table;
  border: 1px solid blue;
}
.line {
  padding-right: 20px;
  border-right: 1px solid #cfc7c0;
}
.first {
  display: table-cell;
  width: 30%;
}
.second {
  display: table-cell;
  width: 30%;
  padding-left: 10px;
}

<div class="container">
  <div class="first line">this is first div and some text</div>
  <div class="second">
    Right
    <br/>and more
    <br/>Side
  </div>
</div>

http://jsfiddle.net/VKqEU/124/

请建议如何实现这一目标？

我正在努力创建类似于Chosen的组件，但是我遇到了flex和wrap的问题。要点是，伪文本框中的每个“筹码”都必须位于一个不包含实际文本输入的容器中，但是我需要将这些筹码作为与相同的基础视为flex元素input。

我的HTML结构如下所示：

<div class="box">
  <div class="chipContainer">
    <div class="chip">Chip1</div>
    <div class="chip">Chip2</div>
    <div class="chip">Chip3</div>
    <div class="chip">Chip4</div>
  </div>
  <input class="textbox" type="text">
</div>

这个Plunker示例更加完整，其样式与我目前正在使用的样式大致相同。

<div class="box">
  <div class="chipContainer">
    <div class="chip">Chip1</div>
    <div class="chip">Chip2</div>
    <div class="chip">Chip3</div>
    <div class="chip">Chip4</div>
  </div>
  <input class="textbox" type="text">
</div>

.box {
  background: #fff;
  border: 1px solid #ccc;
  width: 500px;
  overflow: auto;
  padding: 2px;
  display: flex;
  flex-wrap: wrap;
}
.chip {
  display: inline-block;
  border: 1px solid #ccc;
  background: #eee;
  padding: 2px;
  margin-right: 1px;
  flex: auto;
}
.textbox …

前几天我有点累了,我写了这个JavaScript代码:

var obj = {a(toto){console.log("func a: ", toto);} };

然后我试过:

obj.a("hello");
> func a:  hello

它奏效了.

我真正打算写的是:

var obj = {a: function(toto){console.log("func a: ", toto);} };

所以我的问题是:为什么第一个代码有效？

是否有某个文档可以解释它,您认为我可以使用它吗？(它可以在所有浏览器中使用吗？)