来自 Xaml 文件的 TextBlock 元素的 Javascript 数组 [英] Javascript array of TextBlock elements from Xaml file

问题描述

一个有效的 xaml 文件 (Silverlight) 有很多 TextBlock 元素.我需要那些用于数据操作，所以我想把它们放在一个全局数组中:

A working xaml file (Silverlight) has a lot of TextBlock elements. I need those for data manipulation, so I want to put them in a global array:

var textBlockArray = [];

function fillDataArray() {
    textBlockArray = document.getElementsByTagName("TextBlock");
}

function OnLoaded() {
    alert('In Vowels');
    fillDataArray();
}

textBlockArray.length 为 0.任何人都知道为什么?我认为它与document.getElementsByTagName"有关(它获取 html 元素，而不是 silverlight 元素?)所以我想我需要做这样的事情:

textBlockArray.length is 0 however. Anyone has an idea why? I think it has something to do with "document.getElementsByTagName" (this gets html elements, not silverlight elements?) So I think I need to do something like this:

var textBlockArray = [];

function fillDataArray(sender) {
    textBlockArray = sender.getElementsByTagName("TextBlock");
}

function OnLoaded(sender) {
    alert('In Vowels');
    fillDataArray(sender);
}

但是sender"没有这样的方法(而且 IntelliSense 对我帮助不大).

But 'sender' doesn't have a method like that (and IntelliSense isn't helping me very much).

这是xaml文件:

http://pastebin.com/BR8bCJxh

onLoaded 事件正确触发，fillDataArray 函数也成功结束(用其他地方的 alert(textBlockArray.length) 测试了这一点)

The onLoaded event fires correctly, and the fillDataArray function also ends succesfully (tested this with an alert(textBlockArray.length) somewhere else)

谢谢.

超短摘要:

所以，基本上，我想要做的就是从我的 Xaml 页面中获取所有元素，并将它们放入 onLoad 函数上的一个数组中.

So, basicly, all I want to do is get ALL elements from my Xaml page and put them into an array on the onLoad function.

推荐答案

如果你真的必须坚持使用 Javascript API(我相信你有很好的理由不使用托管 API)那么我建议你花一点时间查看文档.

If you really must stick with the Javascript API (I'm sure you have really good reason you aren't using the Managed API) then I would suggest you spend a little time reviewing the documentation.

您不能操作 Xaml，就好像它有一些如何成为您的 html 文档 DOM 的一部分一样.该插件自行处理构建的 Silverlight UI 元素集.

You cannot manipulate the Xaml as if it has some how become part of your html documents DOM. The plugin handles the constructed set of Silverlight UI elements itself.

Javascript API 没有为我们提供选择特定类型元素的简单集合的方法.事实上，它无法简单地拥有所有元素的平面集合.我们可以创建一个 javascript 函数来递归地执行这样的枚举，因为只有两个元素将包含其他元素是 Panel 或 Border.

The Javascript API offers us no way to select out a simple collection of elements of a specific type. In fact it offers no way to simply have a flat collection of all the elements. We can create a javascript function to perform such an enumeration recursively on the basis that the only two elements that will contain other elements are a Panel or a Border.

另一个问题是 API 也没有提供确定元素类型的好方法.因此，我们如何确定一个元素是 Border、Panel 还是 TextBlock 并不明显.然而，我们可以通过测试我们期望在该类型上存在的属性来推断类型来处理这个问题(例如，我们期望在`Panel 上有一个 Children 属性).

Another issue is that the API it doesn't offer a good way to determine the type of an element either. Hence its not obvious how we determine whether an element is a Border, a Panel or TextBlock. However we could handle this by infering the type by testing the presence of a property that we would expect on that type (e.g., we expect a Children property on a `Panel).

有了我们可以从元素枚举器开始的所有功能:-

Armed with all that we can start with an element enumerator:-

function forEachDescendant(elem, callBack)
{
    if (typeof elem.children == 'object')
    {
        for (var i = 0; i < elem.children.count; i++)
        {
            var child = elem.children.getItem(i);
            callBack(child);
            forEachDescendant(child, callBack);
        }
    }
    else if (typeof elem.child == 'object')
    {
        callBack(elem.child);
        forEachDescendant(elem.child, callBack);
    }
}

现在我们可以在 Grid 的 Loaded 事件中使用它.我只是要将字符串XX"添加到所有文本块的末尾:-

Now we can use this in the Grid's Loaded event. I'm just going to add the string "XX" to the end of all the textblocks:-

var hasLoaded = false;
function OnLoaded(sender, eventArgs)
{
    if (hasLoaded == true)
        return;

    forEachDescendant(sender, function (elem)
    {
        if (typeof elem.Text == 'string')
        {
            elem.Text += 'XX';
        }
    });

    hasLoaded = true;
}

hasLoaded 不会保护代码不被执行多次.有时，您可以比预期更频繁地获取加载事件.

You'll not the hasLoaded protects the code from executing more than once. Sometimes you can get loaded events more often that you would expect.

这篇关于来自 Xaml 文件的 TextBlock 元素的 Javascript 数组的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！