如何在页面加载时随机更改标识符或目标文字颜色

我试图更改锚点，标识，跨度或b标签文本颜色，但由于随机更改标识符而不会更改。如何在页面加载时随机更改标识符或目标文字颜色

下面是HTML代码：

<a id="XgP7Wrq-1503732157576" tabindex="-1" href="javascript:void(0);" style=""><span class="thin">here</span> <b>sometext</b></a>

这里是JS代码：

var x = getElementsbyid("XgP7Wrq-1503732157576"); 

x.style.color = '#00FF00';

否则，如果任何的替代方式来实现这一目标？

感谢

来源

2017-08-26 Bagful International

没有'getElementsbyid'功能。你可能在考虑'document.getElementById'，在这种情况下删除'＃'。 –

如果以下答案中的任何答案*回答了您的问题，Stack Overflow的工作方式，您可以通过单击旁边的复选标记来“接受”答案; [详细信息]（/ help/someone-answers）。但是，只有当你的问题得到解答时，如果不是，请考虑在问题中增加更多细节。 –

你必须找到一些其他方法来识别它的基础上的东西，不会改变。您还没有给我们足够的信息可以帮助您做到这一点，但有些方法是

在页面结构中，组合选择器可以找到它。例如，如果它是第一个a元素，href="javascript:void(0)"位于div的header类中，则document.querySelector("div.header a[href='javascript:void(0)']")会找到它。或者如果那span.thin是一致的，那么document.querySelector("a > span.thing").parentNode。
如果有关于id的内容没有更改，属性子字符串选择器可以工作（document.querySelector("a[href*='substring']")）。
如果它总是第4个（或其他）a元素与href="javascript:void(0)"，您可以找到它基于（document.querySelectorAll("a[href*='javascript:void(0)']")[3]）。

...等等。这些工具是：

document.getElementById - 但你必须知道它的id，让出去了。
document.querySelector - 找到与给定CSS选择器匹配的第一个元素。可以是一个完整的选择器，包括一个复合选择器。任何有效的CSS选择器都适用
document.querySelectorAll - 查找与给定CSS选择器匹配的所有元素（作为列表）。

来源

2017-08-26 07:36:58

感谢您的回复。 PLZ纠正我。它具有类名.thin和随机ID前其后续 - ＃XgP7Wrq-1503732157576 .thin如果我的目标使用UR提到的方法类 - document.querySelectorAll所以它会工作的？ –

@BagfulInternational：是的，如果它是第一个具有'span.thin'作为直接子元素的'a'元素，那么：var x = document.querySelector（“a> span.thin”）。parentNode; x.style.color = '＃00FF00';'（或只是'document.querySelector（ “A> span.thin”）parentNode.style.color = '＃00FF00';'）。 –

如果您遍历与ID的DOM，正确的语法如下，

var x = document.getElementById("XgP7Wrq-1503732157576"); 
x.style.color = "#00FF00";

你不包括＃标签作为参数，因为该方法将专门查找的ID。

由于元素的ID总是在变化，所以您也可以执行下列操作之一。

// Accessing the third <a> element 
var x = document.getElementsByTagName("a")[2] 
// Accessing the first element with class "apple" 
var x = document.getElementsByClassName("apple")[0]

来源

2017-08-26 07:38:33 Nicholas

@Nicholas - ID变化，每次页面加载 –

嘿Nic，我用这种方式你的答案 - var x = document.getElementsByClassName（“。thin”）[1] x.style.color =“＃F44336”;但不起作用 –

@BagfulInternational同样，你不包括期间。因此，而不是'.getElementsByClassName（“瘦‘）'应该是'.getElementsByClassName（’瘦”）' – Nicholas

尝试使用class

<a id="XgP7Wrq-1503732157576" class="myclass" tabindex="-1" href="javascript:void(0);" style=""><span class="thin">here</span> <b>sometext</b></a>

代码JS：

var x = document.getElementsByClassName("myclass"); 
//for first anchor 
x[0].style.color = "#00FF00"; 
//for all 
for(var i=0; i<= x.length; i++) 
{ 
x[i].style.color = "#00FF00"; 
}

来源

2017-08-26 07:47:28

有对问题的'了'没课。我怀疑如果OP能够控制相关页面，他们就不需要解决change-'id'问题。 –

如何在页面加载时随机更改标识符或目标文字颜色

回答

相关问题