我正在编写客户端JavaScript代码，并且必须从var app= new Vue({
el:'#root',
data(){
return{
challenge_categories:[],
chartData: [],
categories:[],
teams:[],
}
},
mounted(){
this.fetchCategories();
this.chart = this.createChart()
},
methods:{
fetchCategories(){
axios.get("/getallcategories").then(function(response){
this.challenge_categories= response.data;
}.bind(this));
},
setData(data){
this.chartData = data
},
setCategories(categories){
this.categories = categories
},
setOccurrences(){
//console.log(this.challenge_categories);
var categories_occurrences=[];
var categories_labels=[];
for(i=0; i<this.challenge_categories.length;i++){
categories_occurrences[i]= this.challenge_categories[i].occurrences;
categories_labels[i]= this.challenge_categories[i].category_name;
}
//console.log(categories_occurrences);
//console.log(categories_labels);
this.setData(categories_occurrences);
this.setCategories(categories_labels);
return true;
},
createChart() {
return Highcharts.chart('pie-container', {
chart: {
plotBackgroundColor: null,
plotBorderWidth: null,
plotShadow: false,
type: 'pie'
},
title: {
text: ''
},
tooltip: {
pointFormat: '{series.name}: <b>{point.percentage:.1f}%</b>'
},
plotOptions: {
pie: {
allowPointSelect: true,
cursor: 'pointer',
dataLabels: {
enabled: true,
format: '<b>{point.categories}</b>: {point.percentage:.1f} %',
style: {
color: (Highcharts.theme && Highcharts.theme.contrastTextColor) || 'black'
}
}
}
},
xAxis:{
categories:[]
},
series: [{
data: []
}]
})
}
},
watch: {
chartData(data) {
this.chart.series[0].setData(data);
console.log(this.chart.series[0].name);
this.chart.redraw()
},
categories(categories ) {
this.chart.axes[0].setCategories(categories);
this.chart.redraw()
}
}
});
属性中检索URL。
我已经将DOM移到了某个位置：
href哪个输出：
document.getElementById('something').getElementsByTagName('td')[3];
从那里如何获得<td><a href="http://example.com"></a></td>
？
我尝试使用http://example.com，但得到.getAttribute("href")。
我想念什么吗？
答案 0 :(得分：2)
td标签没有href属性（没有表单元格具有此属性）；其子标签a确实如此。
您可以使用查询选择器从表格单元格中获取a标记，从中可以获取href属性。
document.getElementById('something').getElementsByTagName('td')[3].querySelector('a').href;
或者您可以将整个选择组合到查询选择器中。
document.querySelector('#something td:nth-child(3) a').href;
<table id="something">
<td>1</td><td>2</td><td><a href="http://www.example.com">example.com</a></td>
</table>
<script>
console.log(document.querySelector('#something td:nth-child(3) a').href);
</script>
答案 1 :(得分：1)
我想我应该指出（因为这已经被接受），@ LGSon在注释中输入了什么，而@ hev1在他们的回答中输入了，应该以比简单调用{{1 }}上的多个DOM元素。
这里是建议的（并且更好）的调用版本，用于获取getElement值：
href
document.querySelector('#something td:nth-child(3) a').href;
属性存在于锚标记（href）上，该标记是<a>元素的子代。您将需要使用DOM <td>属性之类的东西来抓住锚点：
children答案 2 :(得分：0)
仅使用js（而不是jquery），如果要从选择td标记后继续，请执行以下操作：
td.getElementsByTagName("a")[0].href
td是从示例代码返回的td元素。
答案 3 :(得分：0)
<script>
let x = document.getElementById("test").href;
console.log(x);
</script>
您也可以按类或标签来获取，但必须遍历数组，这可能是页面上的很多标签。
还
document.getElementById('something').getElementsByTagName('td')[3].firstElementChild.href