Question

如何在单行中提及所有属性：）

document.getElementById("image").src = "landscape.jpg";
document.getElementById("image").width = "300";
document.getElementById("image").height = "300";

Answer 1

您无法使用JavaScript在一行中执行此操作;但是，您可以缩写为 two ：

document.getElementById("image").src = "http://lorempixel.com/200/200/nightlife/3";
document.getElementById("image").width = document.getElementById("image").height = "300";

JS Fiddle demo

老实说，我不确定你有什么收获。

当然，如果您选择效率（尽管是微优化），您可以通过缓存document.getElementById()的结果再次返回三行：

var image = document.getElementById('image');
image.src = "http://lorempixel.com/200/200/nightlife/3";
image.width = image.height = "300";

JS Fiddle demo

大多数（如果不是所有）浏览器都可以使用浏览器分配的自动全局变量，将对具有id属性的元素的引用映射到变量该名称（id="image"的元素在全局变量image下）：

image.src = "http://lorempixel.com/200/200/nightlife/3";
image.width = image.height = "300";

JS Fiddle demo

然而，值得注意的是，尽管自动变量是可能的，但它们的使用并不可取：全局变量，特别是在大型代码库或多个贡献者中，容易出错和误用。并且，如下面的评论中所述，它们的使用已经或可能已被弃用（参考：Do DOM tree elements with ids become global variables?）。

以上所有内容均与以下HTML一起使用：

<img src="" id="image" />

Answer 2

您还可以将变量白色保存为元素，这样您每次都不必执行document.getElementById

var img = document.getElementById("image");
img.src = "landscape.jpg";
img.width = img.height = "300";

你也可以在以后的某行中创建一个函数

function setValues(element, props){
    for(var key in props){
        element[key] = props[key];
    }
}

setValues(document.getElementById("image"), {src: "landscape.jpg", width:"300", height:"300"});

如果你需要进行大量的dom操作，你可以看一下像jQuery和zepto这样的框架，但如果这是你唯一需要改变的东西，那就太过分了。

Answer 3

使用：

with(document.getElementById("image")) { src = "landscape.jpg"; width = "300"; height = "300"; }

或使用jQuery：

$("#image").attr("src", "landscape.jpg").width(300).height(300);
// or
$("#image").attr("src", "landscape.jpg").attr("width": "300").attr("height": "300");
// or
$("#image").attr("src", "landscape.jpg").css({ "width": "300px", "height": "300px" });

如何在单行中提及所有属性

3 个答案: